@charset "utf-8";

body,
body#page_premiumMember {
	background: #FFF;	
}
.clear {
	clear: both;
}

header {
	z-index: 100!important;	
}

div.lead {
	margin-bottom: 45px;
	text-align: left;
}
div.lead p {
	margin-bottom: 1em;	
}

div.lead ul {
	margin-left: 1.6em;
	padding: 0;
}

div.lead ul li {
	position: relative;
	margin-bottom: 5px;
	line-height: 1.5;
	list-style: none;
}
div.lead ul li span {
	position: absolute;
	top: 0;
	left: -1.4em;
}
.confirm_title {
	font-weight: 600;
	font-size: 2em;
	margin: 0 0 15px;
	color: #15375f;
	letter-spacing: 1px;
	text-align: center;
}


@media(max-width: 640px) {
.confirm_title {
	font-size: 22px;
}
div.categorytitle p.lead {
	margin-bottom: 25px;
	font-size: 14px;	
}
.categorytitle .lead br,
br.pc {
	display: none;	
}
}

#premium_container {
	background: #FFF;	
}
#premium_container:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}


#contents {
	box-sizing: border-box;
	float: right;	
	width: 800px;
	padding: 40px 0 0;
}
div.premium_col {
	width: 250px;
	float: left;
	cursor: pointer;
	margin: 0 25px 60px 0;
}
figure.col img {
	width: 100%;
	height: auto;	
}
figure.col .main_photo {
	height: 250px;
	overflow: hidden;
	position: relative;
	margin-bottom: 10px;
}
figure.col .thumbnail {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 250px;
	height: 250px;
}
figure.col .thumbnail img {
	opacity: 0;	
}

.premium_gallery div.premium_col:nth-child(3n) {
	margin-right: 0;	
}
.premium_gallery div.premium_col:nth-child(3n+1) {
	clear: both;
}

.member_workstitle {
	font-size: 16px;
	font-weight: 500;
	margin: 0 0 8px;
	line-height: 1.4;
}
.member_school {
	font-size: 14px;
}
.member_name {
	font-size: 16px;
	line-height: 1.4;
	font-weight: 500;
	margin: 0 0 10px;
	padding-bottom: 5px;
	border-bottom: 1px dotted #999;
}
.member_comment {
	font-size: 13px;
	line-height: 1.4;
	margin: 0 0 5px;	
}
.member_url {
	font-size: 12px;
	word-break: break-all;
	margin-top: 20px;	
}

.pswp__caption__center .member_workstitle {
	font-size: 18px;
}

.pswp__caption__center .member_school {
	font-size: 16px;
	margin-bottom: 5px;
}
.pswp__caption__center .member_name {
	font-size: 18px;
	padding-bottom: 0;
	border: none;
	margin-bottom: 10px;
}
.pswp__caption__center .member_comment {
	font-size: 15px;	
}
.pswp__caption__center .member_comment br {
	display: none;	
}
.pswp__caption__center .member_url {
	font-size: 13px;
	padding-bottom: 15px;
}
.pswp__caption__center .member_url a {
	color: #15375f;	
}
@media(max-width: 640px) {
.pswp__caption__center .member_school {
	font-size: 14px;
}
.pswp__caption__center .member_name {
	font-size: 16px;
}
.pswp__caption__center .member_comment {
	font-size: 13px;	
}
.pswp__caption__center .member_url {
	font-size: 11px;	
}
}


figure.col .main_photo img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: auto;
}
@media(min-width: 769px) {
figure.col:hover {
	opacity: 0.8; /* 0.0～1.0 */
	filter: alpha(opacity=80); /* 0～100 */
}
}


#premium_siderbar {
	float: left;
	width: 300px;
	box-sizing: border-box;
	padding: 52px 40px 0 0;
}

#member_list {
	height: 3000px;
	width: 100%;
	position: relative;
}
@media(max-width: 768px) {
#member_list {
	height: 40vh;
}
}

#premium_siderbar table,
#premium_siderbar th,
#premium_siderbar td {
	width: auto!important;
	height: auto!important;
	padding: 0;
}
#premium_siderbar table {
	width: 100%!important;	
}

#premium_siderbar table tr:first-child td,
#premium_siderbar table tr:nth-child(4n+1) td {
	padding: 20px 15px 3px 0;
	font-size: 13px;
}
#premium_siderbar table tr:nth-child(2) td,
#premium_siderbar table tr:nth-child(4n+2) td {
	font-weight: 500;
	font-size: 15px;
	padding: 0 15px 5px 0;
	line-height: 1.3;
}
#premium_siderbar table tr:nth-child(3) td,
#premium_siderbar table tr:nth-child(4n+3) td {
	font-size: 13px;
	padding: 5px 15px 0px 0;
	line-height: 1.3;
}
#premium_siderbar table tr:nth-child(4n) td {
	padding: 0 15px 20px 0;
	font-size: 11px;
	word-break: break-all;
	border-bottom: 1px solid #CCC;
}
#premium_siderbar td a,
.member_url a {
	padding-right: 15px;
	background: url(../images/ico_blank.png) no-repeat right 1px;	
}

#contents h4,
#premium_siderbar h4 {
	font-family: 'Noto Serif JP', sans-serif;
	font-weight: 600;
	color: #15375F;
	line-height: 1.0;
}

#contents h4 {
	margin: 0 0 15px;
	font-size: 34px;	
}
#contents h4 span {
	font-size: 16px;
	font-weight: normal;
}
@media(min-width: 641px) {
#contents h4 br {
	display: none;	
}
}

#premium_siderbar h4 {
	margin: 0 0 30px;
	font-size: 22px;
	line-height: 0.9;
}
#premium_siderbar h4 span {
	font-size: 12px;
	font-weight: normal;
}
#premium_siderbar h4 br {
	display: none;	
}

.premium_head {
	text-align: center;
	margin-bottom: 50px;	
}


.pswp__ui--fit .pswp__top-bar, .pswp__ui--fit .pswp__caption {
	background: none!important;	
}

.pswp__bg {
	background: #FFF!important;
	opacity: 0.98!important;
}

.pswp__ui--fit .pswp__caption,
.pswp__top-bar,
.pswp__caption  {
	background: rgba(255,255,255,0.7)!important;
}

.pswp__caption__center {
	color: #000;
}
.pswp__caption__center {
	max-width: 700px!important;
}
.pswp__caption__center h4 {
	color: #023461!important;	
}

.pswp__caption__center {
	font-size: 16px!important;
}
.pswp__caption__center .detail {
	font-size: 18px!important;
	padding-top: 5px;
	line-height: 1.4!important;
}

.pswp__caption {
	min-height: inherit;
}

.pswp__button--arrow--left:before, .pswp__button--arrow--right:before {
	background-color: rgba(2,52,97,1.0)!important;
}


@media(max-width:1150px) {
#contents {
	float: none;
	margin-left: auto;
	margin-right: auto;	
}
#premium_siderbar {
	float: none;
	width: 800px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 20px ;
	padding-right: 0!important;
}
#premium_siderbar h4 {
	font-size: 34px;
	text-align: center;
}
#premium_siderbar h4 span {
	font-size: 16px;
}
#premium_siderbar h4 br {
	display: none;	
}
}

@media(max-width:900px) {
#contents,
#premium_siderbar {
	width: 100%;
}
div.premium_col {
	width: calc(calc(100% - 25px) * 0.33);
	margin: 0 15px 30px 0;
}

figure.col .main_photo {
	height: calc(calc(100vw - 25px) * 0.33);
}
#contents h4,
#premium_siderbar h4 {
	text-align: center;
}
}

@media(max-width:670px) {
#contents,
#premium_siderbar {
	padding-right: 15px;
	padding-left: 15px;	
}
#contents h4,
#premium_siderbar h4 {
	font-size: 20px;
}
.premium_head {
	margin-bottom: 20px;
}
#premium_siderbar h4 {
	margin-bottom: 10px;
}
#premium_siderbar h4 br {
	display: block;	
}
.categorytitle {
	padding-right: 15px;
	padding-left: 15px;	
}
.categorytitle p,
.premium_head p {
	text-align: left!important;	
}
.premium_head p {
	font-size: 14px;	
}

#contents h4 span,
#premium_siderbar h4 span {
	font-size: 12px;
}
div.premium_col {
	width: calc(calc(100% - 20px) * 0.5);
	margin: 0 0px 30px 0;
}
.premium_gallery div.premium_col:nth-child(3n+1) {
	clear: none;	
}
div.premium_gallery div.premium_col:nth-child(even) {
	margin-right: 0;
	float: right;	
}
div.premium_gallery div.premium_col:nth-child(odd) {
	clear: both;	
}

.member_workstitle,
.pswp__caption__center .member_workstitle {
	font-size: 14px;
	margin: 0 0 2px;
}
.member_school,
.pswp__caption__center .member_school {
	font-size: 13px;
	margin: 0;
}
.member_name,
.pswp__caption__center .member_name {
	font-size: 14px;
}
.member_comment,
.pswp__caption__center .member_comment {
	font-size: 13px;
}
.member_url,
.pswp__caption__center .member_url {
	font-size: 10px;
}

figure.col .main_photo {
	height: calc(calc(100vw - 50px) * 0.5);
}

figure.col .thumbnail {
	width: auto;
	height: calc(calc(100vw - 50px) * 0.5);
}

.member_name {
	font-size: 15px;	
}
#premium_siderbar {
	padding-top: 0;	
}


div.lead ul,
div.lead ul li {
	font-size: 13px;
}

}




#contact_contents {
	width: 740px;
	margin: 0 auto;	
}
@media(max-width: 741px) {
#contact_contents {
	width: auto;
}
}



/* ツマミ設定 */
.ps__thumb-y {
	background: #15375F;
	border-radius: 4px;
}

/* ツマミ設定 hover */
.ps__rail-y:hover > .ps__thumb-y,
.ps__rail-y:focus > .ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y {
	background: #15375F;
	border-radius: 4px;
}


.premium_col,
figure.col,
.member_url,
.member_url a {
	-webkit-tap-highlight-color:rgba(0,0,0,0);	
}