@charset "UTF-8";
/********************************************************************************

page-jaw-deformity-treatment.css　顎変形治療ページcss

********************************************************************************/

/*============================================================
 メインビジュアル
*============================================================*/
#page-jaw-deformity-treatment.page-lower #mainvisual.v2 {
	background-image: url(../images/jaw-deformity-treatment/mainvisual-bg.jpg)
}

/*============================================================
 セクション共通
*============================================================*/
#page-jaw-deformity-treatment .section {

}

#page-jaw-deformity-treatment .section .youtube {
	text-align: center;
	margin: 80px 0;
}

/*============================================================
 顎変形症の種類と症状
*============================================================*/
#page-jaw-deformity-treatment #sec-type .block h3 {
	text-align: left;
	margin-bottom: 16px;
}

/*============================================================
 医院選び
*============================================================*/
#page-jaw-deformity-treatment #sec-choose .basic-block .image p {
	text-align: center;
	font-weight: bold;
	margin-top: 16px;
	font-size: 20px;
}

/*============================================================
 サージェリーファースト法
*============================================================*/
#page-jaw-deformity-treatment #sec-comparison h3 {
	text-align: center;
	margin-bottom: 32px;
}
#page-jaw-deformity-treatment #sec-comparison .combi-block.style-2 {
	gap: 104px;
}
#page-jaw-deformity-treatment #sec-comparison .combi-block.style-2 .item::before {
	content: "";
	position: absolute;
	background-image: url(../images/common/icon-list-arrow.svg);
	background-repeat: no-repeat;
	background-size: contain;
	width: 24px;
	height: 16px;
	top: 50%;
	transform: translatey(-50%);
	left: -66px;
}
#page-jaw-deformity-treatment #sec-comparison .combi-block.style-2 .item:first-child::before {
	display: none;
}

/*============================================================
 Youtube
*============================================================*/
#page-jaw-deformity-treatment #sec-movie .youtube {
	width: 100%;
	height: 100%;
}
#page-jaw-deformity-treatment #sec-movie .youtube iframe {
	width: 100%;
	height: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	object-position: center;
}

/*============================================================
 メリット・デメリット
*============================================================*/
#page-jaw-deformity-treatment #sec-merit ul.disc.lower.grid.col2 {
	grid-template-rows: repeat(2, auto);
}

/*============================================================
 流れ
*============================================================*/
#page-jaw-deformity-treatment #sec-flow h2 {
	text-align: center;
}
#page-jaw-deformity-treatment #sec-flow .list-block.style-1 {
	max-width: 500px;
	margin: 0 auto;
}
#page-jaw-deformity-treatment #sec-flow .list-block.style-1 .item {
	align-items: center;
}
#page-jaw-deformity-treatment #sec-flow .list-block.style-1 .item .label {
	width: 120px;
}
#page-jaw-deformity-treatment #sec-flow .list-block.style-1 .item .info {
	width: calc(100% - 152px);
}
#page-jaw-deformity-treatment #sec-flow .list-block.style-1 .item .info h3 {
	margin-bottom: 0;
	font-size: 20px;
}


/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
 Tablet
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
@media screen and (max-width: 1127px) {
    /*============================================================
     メインビジュアル
    *============================================================*/
    #page-jaw-deformity-treatment #mainvisual  {
    }

    /*============================================================
     セクション
    *============================================================*/
    #page-jaw-deformity-treatment #sec-セクション名 {
    }
	/*============================================================
	サージェリーファースト法
	*============================================================*/
	#page-jaw-deformity-treatment #sec-comparison .combi-block.style-2 {
		flex-direction: column;
		align-items: center;
	}
	#page-jaw-deformity-treatment #sec-comparison .combi-block.style-2 .item {
		width: 304px;
	}
	#page-jaw-deformity-treatment #sec-comparison .combi-block.style-2 .item::before {
		top: -56px;
	    transform: rotate(90deg);
    	left: 140px;
	}}



/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/
 SP
_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
@media screen and (max-width: 767px) {
    /*============================================================
     メインビジュアル
    *============================================================*/
    #page-jaw-deformity-treatment #mainvisual  {
    }

    /*============================================================
     セクション
    *============================================================*/
	#page-jaw-deformity-treatment #sec-flow .list-block.style-1 .item {
		gap: 16px;
	}
	#page-jaw-deformity-treatment #sec-flow .list-block.style-1 .item .info {
		width: 100%;
	}
	/*============================================================
	サージェリーファースト法
	*============================================================*/
	#page-jaw-deformity-treatment #sec-comparison .combi-block.style-2 {
		gap: 58px;
	}
	#page-jaw-deformity-treatment #sec-comparison .combi-block.style-2 .item {
		width: 168px;
	}
	#page-jaw-deformity-treatment #sec-comparison .combi-block.style-2 .item::before {
		width: 24px;
		height: 16px;
		top: -37px;
		transform: rotate(90deg);
		left: 70px;
	}
}