@charset "UTF-8";
@import url("single.css");
@import url("low.css");

/* for PC,ipad */
@import url("member_pc.css") screen and (min-width:813px);

/* for iphone,ipod,Andoroid */
@import url("member_mobi.css") screen and (min-width:0) and (max-width:812px);


/* ----------------------------
 member Common
---------------------------- */

.memberWrap {border:1px solid #ededed;}
.memberPage > section > h1{text-align:center;}
.memberBox > li > .inner > h3{line-height:1.57;}
.memberWrap p.noteTxt{line-height:1.4;}
.memberBox > li{
	padding:20px;
	border-radius:3px;
	border:1px solid #ededed;
	overflow:hidden;
}
.memberBox > li > .inner{line-height:1.5;}
.memberBox > li > .inner > dl.colon > dt,
.memberBox > li > .inner > dl.colon > dd{
	display:inline-block;
	font-weight:400;
	line-height:1.5;
}

.memberBox > li > .inner > dl.colon > dt:after{
	content:':';
	margin:0 0.4em;
}

/* individual */
.memberBox .personName dt{
	line-height:1.57;
	font-weight:600;
}
.memberBox .personAdress p{line-height:1.5;}

/* ★update section3 *button* →common.css ★　////////////////////////////////// */



/* btm border */
.memberPage .bdBtm {border-bottom:1px solid #ededed;}
.memberPage .bdTop {border-top:1px solid #ededed;}

/* ///switch/// */

 /* switch area style */
.switch {
	line-height:31px;
	letter-spacing:0;
	text-align:center;
	font-size:31px;
	position:relative;
	margin:auto; 
	width:51px; 
	background:#fff;
	display:inline-block;
}

.switch input[type="checkbox"] {
	display:none;
}
.switch label {
	display:block;
	box-sizing:border-box;
	height:32px;
	border:2px solid #999; 
	border-radius:16px;
	background:#ededed;
	cursor:pointer;
}

.switch input[type="checkbox"]:checked +label {
	border-color:#c01920;
	background:#c01920;
}

 /* switch circle style */
.switch .circleBtn {
	position:absolute;
	width:28px;
	height:28px;
	background:#999999;
	top:2px; 
	left:1px;
	border-radius:14px;
	transition:.3s;
	cursor:pointer;
	box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 1px 0 rgba(0, 0, 0, 0.05);
}


.switch input[type="checkbox"]:checked +label .circleBtn {
	transform:translateX(21px);
	background:#fff;
}


/* diagnosis + image */
.diagnosisImg {
	display: none;
}

.diagnosisImgWrap{
	height:114px;
	display:flex;
	justify-content: center;
	align-items: center;
	word-wrap:break-word;
	text-align:center;
}

.diagnosisImg + .diagnosisImgWrap,
.diagnosisImgWrap{
	border:2px #f7f7f7 solid;
	background-color: #f7f7f7;
	border-radius:30px;
}

.diagnosisImg + .diagnosisImgWrap {cursor:pointer;}
.diagnosisImg:checked + .diagnosisImgWrap {border:2px #c01920 solid;}

.diagnosisImgWrap figcaption,
.diagnosisImgWrap img.playImg{display:inline-block;}

.diagnosisImgWrap figcaption{
	width:100%;
	text-align:center;
	line-height:1;
	font-weight:600;
	margin-top:10px;
}

/* dots */
.dotsWrap span{
	width:8px;
	height:8px;
	background:#d9d9d9;
	border-radius:4px;
	display:block;
	margin:8px auto;
}



/* ----------------------------
 melmaga Add
---------------------------- */
#melmagaAddList .inner > .leftBox h2{line-height:1.57;}
#melmagaAddList .inner > .rightBox{text-align:right;}

/* ----------------------------
order history
---------------------------- */
#orderHistoryContent {border:1px solid #ededed;}

/* head select */
#orderHistoryContent  .orderHistoryHead {text-align:right;}
#orderHistoryContent .orderHistorySelect{display:inline-block;}

/* order date */
#orderHistoryContent .orderDateOne dl.orderDate{
	background:#f7f7f7;
	letter-spacing:-.4em;
}
#orderHistoryContent .orderDateOne dl.orderDate > dt,
#orderHistoryContent .orderDateOne dl.orderDate > dd{
	display:inline-block;
	letter-spacing:normal;
	font-weight:600;
	line-height:1.5;
	opacity:0.5;
}


/* one primary */
#orderHistoryContent .orderItemOne h2.status{line-height:1.0;}
#orderHistoryContent .orderItemOne dl.orderNo{letter-spacing:-.4em;}
#orderHistoryContent .orderItemOne dl.orderNo > dt,
#orderHistoryContent .orderItemOne dl.orderNo > dd{
	color:#414141;
	display:inline-block;
	letter-spacing:normal;
	font-weight:600;
	line-height:1.0;
}

#orderHistoryContent .orderItemOne .itemListOne figure,.orderItemOne .itemListOne .itemDataBox{
	display:inline-block;
	vertical-align:top;
}

#orderHistoryContent .orderItemOne .itemListOne .itemDataBox .itemBrand{color:#808080;}


/* one secondary */
.orderItemOne .secondary .newseries a{
	padding:13px 0 15px;
	font-weight:600;
	display:block;
	text-align:center;}

/* ★update section 3 ★　////////////////////////////////// */
.orderItemOne .secondary .newseries.whButton{
	padding:0 !important;
}

/* ▲update section 3 ▲　////////////////////////////////// */

/* gift */
.giftMk {

	background:#c01920;
	text-align:center;
	padding-top:2px;
	overflow:hidden;
}

.giftMk img{
	width:16px;
}

.giftTr{
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 16px 9px 16px;
	border-color: transparent transparent #fff transparent;
}

/* ----------------------------
 diagnosis
---------------------------- */

/* foot size */
#dominantFoot .footSize > div.leftBox{border-right:1px solid #ededed;}
#dominantFoot dl{letter-spacing:-.4em;}
#dominantFoot dt,#dominantFoot dd{
	vertical-align:top;
	letter-spacing:normal;
	display:inline-block;}

#dominantFoot .footSize > div > dl > dt{
	line-height:1.5;
	font-weight:600;
}

#dominantFoot .footSize > div > dl > dd > dl{line-height:1.33;}
/* importance select */
#importanceSelect .noteTxt{
	margin-top:5px;
	color:#808080;}

#importanceSelect li{
	margin-bottom:10px;
	margin-right:10px;
}

/* ★update section 3 ★　////////////////////////////////// */

.diagnosisWrapTb h2{
	line-height:1.8;
	font-weight:600;
}

.diagnosisWrapTb h3{
	line-height:1.5;
	font-weight:600;
}

.diagnosisTb{
	width:100%;
	border-top:1px solid #ededed;}



.diagnosisTb th{
	vertical-align:middle;
	text-align:left;}

.iconListBox th{vertical-align:top;}

/* foot  size*/
.footSize .foot dt,.footSize .foot dd{
	vertical-align:top;
	display:inline-block;}

.footSize .foot > dl > dt,
.footSize .foot > dl > dd{
	text-align:left;
	line-height:1.5;}
.footSize .foot > dl > dt{font-weight:600;}
.footSize .leftBox > dl{border-right:1px solid #ededed;}

/* iconbox */
.diagnosisIcon {
	display:table;
	background:#f7f7f7;
	border-radius:24px;
	overflow:hidden;
}
.diagnosisIcon > div,
.diagnosisIcon > figcaption{
	display:table-cell;
	vertical-align:middle;
}

.diagnosisIcon > div{text-align:center;}
.diagnosisIcon > div > .playImg{width:32px;}
.diagnosisIcon > figcaption{
	line-height:1.29;
	font-weight:600;
	text-align:left;}

.diagnosisWrapTb .iconOnly div.imgBox{display:inline-block;}

/* spike box */
.diagnosisWrapTb .spikeListBox th{vertical-align:top;}
.diagnosisWrapTb .spikeListBox td{text-align:left;}
.diagnosisWrapTb .spikeListBox .brandName{
	font-weight:600;
	line-height:1.25;
}

.diagnosisWrapTb .spikeListBox .spikeName li{display:inline;}
.diagnosisWrapTb .spikeListBox .spikeName li:after{content:"/";}
.diagnosisWrapTb .spikeListBox .spikeName li:last-child:after{content:"";}




/* ----------------------------
 contact faq
---------------------------- */
#contact-faqFmList .selctOff{
	opacity:0.5;
}

/* q and a */
#contact-faq-qalist {
	border:1px solid #ededed;
	border-radius:3px;
}
#contact-faq-qalist h2 span{
	display:inline-block;
	vertical-align:top;
}
#contact-faq-qalist h2 .inner{
	font-weight:600;
	line-height:16px;
	padding:7px 0 0 4px;
}
#contact-faq-qalist dt{display:table;}
#contact-faq-qalist dt > span,
#contact-faq-qalist dt > h3,
#contact-faq-qalist dt > div{
	display:table-cell;
	vertical-align:middle;
}

#contact-faq-qalist dt > span,
#contact-faq-qalist dt > h3{
	font-weight:600;
	line-height:1.57;
}

#contact-faq-qalist dt > div{
	font-weight:400;
	text-align:right;
	cursor:pointer;
}
#contact-faq-qalist dd{line-height:1.57;}

#contact-faq-qalist dt > div.close{display:none;}
#contact-faq-qalist dd{display:none;}
#contact-faq-qalist li:first-child dt .open{display:none;}
#contact-faq-qalist li:first-child dd,
#contact-faq-qalist li:first-child dt .close{display:block;}

/* ----------------------------
 contact
---------------------------- */
#contactFm > h2{
	text-align:center;
	line-height:1.44;
	font-weight:600;
}

#contactFmList  dl.contactRadio > dd > .cirRadioBox > li,
#contactFmList  dl.contactCheck > dd > .imageCheckBox > li{margin-right:6px !important;}
/* ▲update section 3 ▲　////////////////////////////////// */