@charset "UTF-8";

.contentpage .m_img_area {
	background-image: url(../images/botox/m_img@2x.jpg);
}
.com_lead_bg::before{
	background-image: url(../images/botox/lead_bg@2x.jpg);
}



/*med_check_box
---------------------------------------------------------*/
.med_check_box {
	border: 1px solid #20A19F;
}



/*ボトックス治療について
---------------------------------------------------------*/
.box01 .effect_list{
	max-width: 1025px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	font-size: 133%;
	letter-spacing: 0.05em;
	line-height: 1.5em;
	text-align: center;
	font-weight: bold;
	color: #20a19f;
}
.box01 .effect_list li{
	max-width: 215px;
	width: 24%;
}
.box01 .effect_list li div{
	max-width: 210px;
	width: 98%;
	margin: 0 auto 1em;
	text-align: center;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.box01 .effect_list{
	font-size: 110%;
	letter-spacing: 0.03em;
}
.box01 .effect_list li{
	width: 24.5%;
}
.box01 .effect_list li div{
	width: 96%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.box01 .effect_list{
	max-width: 98%;
    flex-wrap: wrap;
	font-size: 100%;
	letter-spacing: 0.03em;
}
.box01 .effect_list li{
	max-width:49.5%;
	width: 49.5%;
	margin-top: 6%;
}
.box01 .effect_list li:nth-child(-n + 2){
	margin-top: 0;
}
.box01 .effect_list li div{
	width: 90%;
	margin-bottom: 0.6em;
}
}



/*ボトックス治療の流れ
---------------------------------------------------------*/
.box02 .flow{
	display: flex;
	justify-content: space-between;
	position: relative;
	margin-bottom: 60px;
}
.box02 .flow::before{
	position: absolute;
	content: "";
	background: #f2f2f2;
	width: 100%;
	height: 4px;
	left: 0;
	right: 0;
	margin: auto;
	top:calc(50% + 21px);
	transform: translateY(-50%);
}
.box02 .flow li{
	max-width: 360px;
	width: 32%;
	padding: 0 3% 50px;
	box-sizing: border-box;
	position: relative;
	z-index: 1;
}
.box02 .flow li::before{
	position: absolute;
	content: "";
	background: #f2f2f2;
	width: 100%;
	height: calc(100% - 21px);
	left: 0;
	bottom: 0;
	z-index: -1;
}
.box02 .flow li dl{
	max-width: 280px;
	margin: 0 auto;
}
.box02 .flow li dl dt{
	font-size: 154%;
	letter-spacing: 0.05em;
	line-height: 1.5em;
	text-align: center;
	color: #20a19f;
	font-weight: bold;
	margin-bottom: 0.5em;
}
.box02 .flow li div{
	max-width: 43px;
	margin: 0 auto 50px;
	text-align: center;
}
.box02 .c_b_txt{
	font-size: 134%;
	letter-spacing: 0.05em;
	line-height: 1.5em;
	text-align: center;
	font-weight: bold;
	margin-bottom: 60px;
}
.box02 .test_box{
	border: 1px solid #20a19f;
	padding: 50px 4% 60px;
}
.box02 .test_box .inbox{
	max-width: 1045px;
	margin: 0 auto;
}
.box02 .test_box h3{
	font-size: 200%;
	letter-spacing: 0.05em;
	line-height: 1.5em;
	font-weight: bold;
	color: #20a19f;
	text-align: center;
	margin-bottom: 50px;
	padding-bottom: 40px;
	border-bottom: 1px solid #20a19f;
}
.box02 .test_box .flt_box .img_r{
	max-width: 390px;
	width: 38%;
	float: right;
}
.box02 .test_box .flt_box .txt_l{
	max-width: 555px;
	width: 54%;
	float: left;
}
.box02 .note_list{
	line-height: 1.8em;
	padding-left: 1em;
	text-indent: -1em;
	margin-top: 1em;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.box02 .flow{
	margin-bottom: 6%;
}
.box02 .flow::before{
	top:calc(50% + 15px);
}
.box02 .flow li{
	padding: 0 3% 5%;
}
.box02 .flow li::before{
	height: calc(100% - 15px);
}
.box02 .flow li dl{
	max-width: 100%;
}
.box02 .flow li dl dt{
	font-size: 144%;
}
.box02 .flow li div{
	max-width: 30px;
	margin: 0 auto 5%;
}
.box02 .c_b_txt{
	font-size: 124%;
	margin-bottom: 6%;
}
.box02 .test_box{
	padding: 5% 4% 6%;
}
.box02 .test_box .inbox{
	max-width: 100%;
}
.box02 .test_box h3{
	font-size: 180%;
	margin-bottom: 5%;
	padding-bottom: 4%;
}
.box02 .test_box .flt_box .img_r{
	margin-left: 4%;
	margin-bottom: 1em;
}
.box02 .test_box .flt_box .txt_l{
	max-width: 100%;
	width: 100%;
	float: none;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.box02 .flow{
	display: block;
	margin-bottom: 6%;
}
.box02 .flow::before{
	width: 2vw;
	height: calc(100% - 5vw);
	top:5vw;
	transform: translateY(0)
}
.box02 .flow li{
	max-width: 100%;
	width:100%;
	padding: 0 5% 7%;
	margin-top: 10%;
	border-bottom: 2vw solid #fff;
}
.box02 .flow li::before{
	height: calc(100% - 5vw);
}
	.box02 .flow li::after{
		position: absolute;
		content: "";
		background: #fff;
		width: 100%;
		height: 7vw;
		left: 0;
		right: 0;
		margin: auto;
		top:-2vw;
		z-index: -1;
	}
.box02 .flow li dl{
	max-width: 100%;
}
.box02 .flow li dl dt{
	font-size: 130%;
	letter-spacing: 0.05em;
	line-height: 1.5em;
	text-align: center;
	color: #20a19f;
	font-weight: bold;
	margin-bottom: 0.5em;
}
.box02 .flow li div{
	max-width: 10vw;
	width: 10vw;
	margin: 0 auto 6%;
	text-align: center;
}
.box02 .flow li div img{
	width: 100%;
}
.box02 .c_b_txt{
	font-size: 115%;
	margin-bottom: 8%;
}
.box02 .test_box{
	padding: 6% 5%;
}
.box02 .test_box .inbox{
	max-width: 100%;
}
.box02 .test_box h3{
	font-size: 140%;
	margin-bottom: 6%;
	padding-bottom: 5%;
}
.box02 .test_box .flt_box .img_r{
	width: 80%;
	float: none;
	margin: 0 auto 5vw;
}
.box02 .test_box .flt_box .txt_l{
	max-width: 100%;
	width: 100%;
	float: none;
}
}



/*症例集
---------------------------------------------------------*/
.box04 .case_box{
	margin-bottom: 20px;
}
.box04 .case_box > dl > dd table{
	margin-bottom: 0;
}
.box04 .risk_cannot_box{
	margin-top: 80px;
	background: #0C4676;
	color: #fff;
	padding: 45px 3% 55px;
	box-sizing: border-box;
}
.box04 .risk_cannot_box .inbox{
	max-width: 1125px;
	margin: 0 auto;
}
.box04 .risk_cannot_box .inbox > div:first-child{
	border-bottom: 1px solid #4b779a;
	padding-bottom: 30px;
	margin-bottom: 35px;
}
.box04 .risk_cannot_box .inbox dl{
	max-width: 920px;
	width: 94%;
	margin: 0 auto;
}
.box04 .risk_cannot_box .inbox dt{
	font-size: 110%;
	letter-spacing: 0.15em;
	line-height: 1.5em;
	font-weight: bold;
	text-align: center;
	margin-bottom: 0.8em;
}
.box04 .risk_cannot_box .inbox dd li{
	padding-left: 1em;
	text-indent: -1em;
}

/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
.box04 .case_box{
	margin-bottom: 10px;
}
.box04 .risk_cannot_box{
	margin-top: 50px;
	padding: 4% 3% 5%;
}
.box04 .risk_cannot_box .inbox > div:first-child{
	padding-bottom: 3%;
	margin-bottom: 3.5%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
.box04 .case_box{
	margin-bottom: 3%;
}
.box04 .risk_cannot_box{
	margin-top: 10%;
}
.box04 .risk_cannot_box{
	margin-top:10%;
	padding: 6% 5%;
}
.box04 .risk_cannot_box .inbox > div:first-child{
	padding-bottom: 6%;
	margin-bottom: 6.5%;
}
.box04 .risk_cannot_box .inbox dt{
	letter-spacing: 0.1em;
	margin-bottom: 0.6em;
}
}



/*よくある質問
---------------------------------------------------------*/
.box05 .med_qa_box li dt {
	background-image: url(../images/botox/icon_q.svg);
}