@charset "utf-8";


#intro1Top {overflow:hidden; position:relative}
#intro1Top:before {content:""; position:absolute; bottom:0; left:50%; margin-left:-0.5px; width:1px; height:35%; background:#e0deea; z-index:1;}
#intro1Top h3 {font-size:60px; font-weight:200; line-height:1.2em; color:#222; position:relative }
#intro1Top img {width:100%; margin-top:-35px}
#intro1Top dl {margin-top:4%; padding-left:8%; width:50%; float:right }
#intro1Top dl dt {font-size:30px; color:#222;  font-family: 'Marcellus', serif; }
#intro1Top dl dd {margin-top:1em; font-size:18px; max-width:90%;  line-height:1.6em;  }
@media all and (max-width:976px) {
	#intro1Top h3 {font-size:50px;}
}
@media all and (max-width:767px) {
	#intro1Top:before {display:none}
	#intro1Top h3 {font-size:6.5vw}
	#intro1Top img { margin:6% 0}
	#intro1Top dl {margin-top:0; text-align:center;  padding-left:0; width:100%}
	#intro1Top dl dd {width:85%; margin:1em auto 0}
}



#history h3 { font-size:130px;  line-height:0.8em;  width:50%; padding-right:8%; text-align:right; color:#645894; font-family: 'Marcellus', serif; position:absolute; left:0;; top:0; font-weight:normal }

.his_wrap {padding-top:180px; overflow:hidden; box-sizing:border-box; position:relative; }
.his_wrap:before{content:""; position:absolute; top:0; left:50%; margin-left:-0.5px; width:1px; height:100%; background:#e0deea; z-index:1;}

.his_wrap .his_bx{box-sizing:border-box; padding-top:5em; position:relative; overflow:hidden;}
.his_wrap .his_bx .in{clip: rect(auto, auto, auto, auto); top:0; left:0; width:100%; height:100%; position:absolute; z-index:0; overflow:hidden;}
.his_wrap .his_bx .in .bg{position: fixed; display: block; top: 0; left: 0; width: 100%; height: 100%; background-repeat:no-repeat; background-position:center center; transform: translateZ(0); will-change: transform; }
.his_wrap .his_bt{padding-bottom:8em}

.his_wrap li {position:relative; z-index:2;  width:50%; float:right; text-align:left; padding:0 20px 3em 5%; box-sizing:Border-box; }
.his_wrap li:before {content:""; position:absolute; top:0.45em; left:-4px; width:9px; height:9px; border-radius:100%; background:#645894; }
.his_wrap li+li{clear:both;}

.his_wrap li .t { position:relative; font-size:50px;  font-family:'Playfair Display'; margin-bottom:50px; color:#645894; font-weight: 700; line-height:0}
.his_wrap li .c { margin-bottom:1em;  }
.his_wrap li .c dt { font-size:26px; width:50px; display:inline-block; vertical-align:top; color:#222; line-height:1.2em; }
.his_wrap li .c dd { font-size:18px; width:calc(100% - 50px); display:inline-block; vertical-align:top; line-height:1.6em; }

.his_wrap li:nth-of-type(2n) {float:left; text-align:right; padding:0 5% 3em 20px;}
.his_wrap li:nth-of-type(2n)::before { left:unset; right:-5px; }
.his_wrap li:nth-of-type(2n) dt{float:right; }
.his_wrap li:nth-of-type(2n) .c p::before { left: unset; right:0; }

@media all and (max-width:1024px) {
	#history h3 { font-size:100px; }
}
@media all and (max-width:767px) {
	#history {margin-top:15%}
	#history h3 {margin-bottom:8%;  font-size:90px;  width:100%; padding-right:0; position:inherit}
	
	.his_wrap {padding-top:0; }
	.his_wrap .his_bx{ padding-left:10px;}
	.his_wrap:before{ margin-left:0; left:10px;  }
	.his_wrap li{ width:100%; padding:0 0 7em 8%; }
	.his_wrap li:before {top:0}
	.his_wrap li .t { font-size: 4.0rem; }
	.his_wrap li .t:before { top:0.35em;  }
	.his_wrap li .c dt{ width:50px; }
	.his_wrap li .c dd{width:calc(100% - 50px); }

	.his_wrap li:nth-of-type(2n){float:right; text-align:left;  padding:0 0 7em 8%;}
	.his_wrap li:nth-of-type(2n)::before { left:-5px; right:inherit }
	.his_wrap li:nth-of-type(2n) dt{float:left; }
}
@media all and (max-width:480px) {
	#history h3 { font-size:24vw; }

	.his_wrap li .t { margin-bottom:40px; }
	.his_wrap li .c dt { font-size:22px; width:40px;}
	.his_wrap li .c dd { font-size:16px;  width:calc(100% - 40px); }
}







#intro1Vision { display:flex; flex-wrap:wrap; justify-content:center; align-items: center;}
#intro1Vision #contWrap h3 {margin-left:-60px; font-size:130px; color:#645894; font-family: 'Marcellus', serif; font-weight:normal; }
#intro1Vision #contWrap h3 .t1 { font-size:50px; color:#222; font-weight:200; font-family:'SUIT'}
#intro1Vision #contWrap ul {display:flex; gap:30px; flex-wrap:wrap; margin-top:5em; max-width:910px;  padding-left:15%}
#intro1Vision #contWrap ul li {width:calc(50% - 30px)}
#intro1Vision #contWrap ul li dl {padding:30px 0 20px; border-top:1px solid rgba(100,88,148,0.15); }
#intro1Vision #contWrap ul li dl dt {font-size:28px; color:#222; font-weight:600}
#intro1Vision #contWrap ul li dl dd {margin-top:0.7em; font-size:1.8rem; line-height:1.4em;}


@media all and (max-width:1499px) {
	#intro1Vision #imgWrap { width:35%}
	#intro1Vision #imgWrap img { width:100%}
	#intro1Vision #contWrap { width:65%}
}
@media all and (max-width:1399px) {
	#intro1Vision {align-items: top;}
	#intro1Vision #contWrap ul {padding-left:10%;  margin-top:5%;}
	#intro1Vision #contWrap ul li dl {padding:20px 0 10px;}
}
@media all and (max-width:1024px) {
	#intro1Vision {flex-wrap:wrap}
	#intro1Vision #imgWrap { width:100%; text-align:center} 
	#intro1Vision #imgWrap img {width:80%; max-width:480px}
	#intro1Vision #contWrap { width:100%}
	#intro1Vision #contWrap h3 {margin-left:0; font-size:100px}
	#intro1Vision #contWrap h3 .t1 { font-size:35px}
	#intro1Vision #contWrap ul {max-width:100%;  padding-left:0}
	#intro1Vision #contWrap ul li dl dt {font-size:24px;}
}
@media all and (max-width:767px) {
	#intro1Vision #contWrap ul {flex-wrap:wrap; gap:0; width:90%; margin:0 auto}
	#intro1Vision #contWrap ul li {width:100%}
	#intro1Vision #contWrap h3 {font-size:90px; margin-top:-60px}
	#intro1Vision #contWrap h3 .t1 {display:none}
}



#intro1Value #engTitle {text-align:right; margin-bottom:8em;}
#intro1Value #engTitle h3 {font-size:130px; color:#645894; font-family: 'Marcellus', serif; font-weight:normal; line-height: 1em }
#intro1Value #engTitle .t1 { font-size:30px; color:#222; font-weight:200; font-family:'SUIT'}
#intro1Value ul {display:flex; flex-wrap:wrap; justify-content:center; gap:100px}
#intro1Value ul li {text-align:center}
#intro1Value ul li .icon {width:250px; height:250px; border:1px solid rgba(100,88,148,0.15); border-radius:100%;
							display:flex; justify-content:center; align-items: center;}
#intro1Value ul li dl {margin-top:3em; }
#intro1Value ul li dl dt {font-size:28px; color:#222; font-weight:600}
#intro1Value ul li dl dd {margin-top:0.7em; font-size:1.8rem; line-height:1.4em;}

@media all and (max-width:1024px) {
	#intro1Value #engTitle h3 {font-size:100px}
	#intro1Value #engTitle .t1 { font-size:25px; }

	#intro1Value ul { gap:0}
	#intro1Value ul li {width:31%; margin:0 1%}
	#intro1Value ul li .icon {width:25vw; height:25vw; margin:0 auto}
	#intro1Value ul li dl dt {font-size:24px;}
}
@media all and (max-width:767px) {
	#intro1Value #engTitle h3 {font-size:90px}
	#intro1Value ul li {width:48%; margin:0 1% 3em 1%}
	#intro1Value ul li .icon {width:30vw; height:30vw;}
	#intro1Value ul li .icon img {width:60%}
	#intro1Value ul li dl {margin-top:1em; }
}
@media all and (max-width:480px) {
	#intro1Value #engTitle h3 { font-size:24vw; }
	#intro1Value #engTitle .t1 {font-size:6vw; margin-top:3vw}

	#intro1Value ul li {width:98%;}
	#intro1Value ul li .icon {width:40vw; height:40vw;}
}





#intro1-4 {width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; gap:25px;}
#intro1-4 li{ width:calc(25% - 20px); border: 1px solid rgba(100,88,148,0.15) }
#intro1-4 li .img{width: 100%; padding:15px}
#intro1-4 li .img img{width: 100%;}
#intro1-4 li .txt{width: 100%; text-align: center; padding: 20px; background-color: #645894 ; color: #fff; font-size: 18px;}

@media screen and (max-width:1280px){
    #intro1-4 li{width:calc(33% - 20px); }
}
@media screen and (max-width:976px){
	#intro1-4 { gap:15px;}
    #intro1-4 li{width:calc(33% - 15px); }
}
@media screen and (max-width:767px){
     #intro1-4 li{width:calc(50% - 15px); }
}
@media screen and (max-width:480px){
	#intro1-4 { gap:0}
     #intro1-4 li{ width:48%; margin:1% }
	 #intro1-4 li .txt{padding: 15px 0; font-size: 4vw}
}








/* intro1 */
#intro2 {}
#intro2 .s-inner{}
#intro2 .s-inner .tit{font-size: 68px; font-weight: 200; color: #333333; text-align: center; margin: 120px 0 90px;}
#intro2 .s-inner .tit b{color: #52419d;}
#intro2 .s-inner .box{display: flex; gap:0 110px;}
#intro2 .s-inner .box .img{width: 535px;}
#intro2 .s-inner .box .img img{max-width: 100%;}
#intro2 .s-inner .box .txt{ display: flex; flex-direction: column; width: calc(100% - 535px);}
#intro2 .s-inner .box .txt h3{font-size: 40px; font-weight: 200; color: #222222; line-height: 1.5em; margin-bottom: 75px; word-break: keep-all;}
#intro2 .s-inner .box .txt h3 b{font-weight: 600; color: #52419d;}
#intro2 .s-inner .box .txt p{font-size: 18px; color: #6e6b7a; line-height: 1.8em;}
#intro2 .s-inner .box .txt p+p{margin-top: 55px;}
#intro2 .s-inner .box:nth-child(even){flex-direction: row-reverse; margin-top: -84px;}
#intro2 .s-inner .box:nth-child(even) .txt{align-self: flex-end;}

@media all and (max-width:1280px){
	#intro2 .s-inner .tit{font-size: 56px; margin: 100px 0 80px;}
	#intro2 .s-inner .box .img{width: 480px;}
	#intro2 .s-inner .box{gap:0 80px;}
	#intro2 .s-inner .box .txt{ width: calc(100% - 480px);}
	#intro2 .s-inner .box .txt h3{font-size: 36px; margin-bottom: 50px;}
	#intro2 .s-inner .box .txt p{font-size: 17px;}
	#intro2 .s-inner .box .txt p br{display: none;}
	#intro2 .s-inner .box .txt p+p{margin-top: 40px;}
	#intro2 .s-inner .box:nth-child(even){margin-top: 60px;}
}
@media all and (max-width:976px){
	#intro2 .s-inner .tit{font-size: 41px; margin: 90px 0 70px;}
	#intro2 .s-inner .box{gap:0 50px;}
	#intro2 .s-inner .box .txt h3{font-size: 32px; margin-bottom: 35px;}
	#intro2 .s-inner .box .txt p{font-size: 16px;}
	#intro2 .s-inner .box .txt p+p{margin-top: 30px;}
	#intro2 .s-inner .box .img{width: 50%;}
	#intro2 .s-inner .box .txt{ width: calc(100% - 50%);}
}
@media all and (max-width:640px){
	#intro2 .s-inner .tit{font-size: 30px; margin: 70px 0 55px; text-align: left;}
	#intro2 .s-inner .box:nth-child(even),
	#intro2 .s-inner .box{flex-direction: column;}
	#intro2 .s-inner .box .img{width: 100%;}
	#intro2 .s-inner .box .img img{width: 100%;}
	#intro2 .s-inner .box .txt{width: 100%; padding-bottom: 0;}
	#intro2 .s-inner .box .txt h3{font-size: 28px; margin-bottom: 30px;}
	#intro2 .s-inner .box .txt p{font-size: 15px;}
	#intro2 .s-inner .box .txt p+p{margin-top: 25px;}
	#intro2 .s-inner .box:nth-child(even){margin-top: 40px;}
}
@media all and (max-width:480px){
	#intro2 .s-inner .tit{font-size: 25px; margin: 60px 0 45px;}
	#intro2 .s-inner .box .txt h3{font-size: 24px; margin-bottom: 20px;}
}



#intro2-1 { display:flex}
#intro2-1 #imgWrap {width:440px}
#intro2-1 #imgWrap .ytb {padding: 10px 0; width: 100%; overflow-x: auto;}
#intro2-1 #imgWrap .ytb::-webkit-scrollbar {height: 14px; cursor: pointer;}
#intro2-1 #imgWrap .ytb::-webkit-scrollbar-thumb {background-color: #645894;}
#intro2-1 #imgWrap .ytb ul{display: flex;}
#intro2-1 #imgWrap .ytb ul li{height: 100px; margin-right: 8px;}
#intro2-1 #imgWrap .ytb ul li img{width: auto; max-height: 100%;}
#intro2-1 #imgWrap img {width:100%; max-width:440px}
#intro2-1 #contWrap {margin-top:4%}
#intro2-1 #contWrap dl dd {font-size:2.4rem; color:#645894; font-weight:600}
#intro2-1 #contWrap dl dt {font-size:5.0rem; color:#333; font-weight:800}
#intro2-1 #contWrap {padding-left:8%;width:calc(100% - 440px)}
#intro2-1 #contWrap .tit {margin:2em 0 20px; font-size:2.2rem; display:inline-block; width:150px; text-align:center; line-height:50px; border-radius:50px; background:#645894; color:#FFF}
#intro2-1 #contWrap .tit.bg2 {background:#906692}
#intro2-1 #contWrap .field { display:flex; flex-wrap:wrap}
#intro2-1 #contWrap .field li {font-size:1.8rem; padding-right:1.5em; margin:0.3em 1.5em 0.3em 0; border-right:1px solid #e3e3e3 }
#intro2-1 #contWrap .field li:last-child {border-right:0}
#intro2-1 #contWrap .cont {display:flex; gap:80px}
#intro2-1 #contWrap .dotList .pdt {margin-top:25px}

#intro2-1.ver2 {margin:5% auto; padding:5% 0; border-top:2px dashed #e9e9e9; border-bottom:2px dashed #e9e9e9}
#intro2-1.ver2 #imgWrap {order:2}
#intro2-1.ver2 #contWrap  {order:1; padding-left:0; padding-right:8%}

@media all and (max-width:1280px){
	#intro2-1 #contWrap {padding-left:5%;}
	#intro2-1 #contWrap .cont {gap:50px}
	#intro2-1.ver2 #contWrap  {padding-right:5%}
}
@media all and (max-width:1280px){
	#intro2-1 #imgWrap {width:350px}
	#intro2-1 #contWrap { width:calc(100% - 350px)}
}
@media all and (max-width:976px){
	#intro2-1 {flex-wrap:wrap}
	#intro2-1 #imgWrap {width:100%; text-align:center; margin-bottom:3em; }
	#intro2-1 #contWrap { width:100%; padding-left:0}
	#intro2-1.ver2 #imgWrap {order:1}
	#intro2-1.ver2 #contWrap  {order:2; padding-right:0}
}
@media all and (max-width:640px){
    #intro2-1 #imgWrap .ytb ul li{height: 70px;}
	#intro2-1 #contWrap .cont {flex-wrap:wrap; gap:20px}
	#intro2-1 #contWrap .cont ul {width:100%}

}



 


#intro4 {display: flex; align-items: flex-start; max-width: 1440px; margin: 0 auto;}
#intro4 .right-c{width: calc(50% + 20px); margin-left: -20px; position: relative; z-index: -1;}
#intro4 .right-c .top p{padding-left: 32px; font-weight: 800; color: #554982; opacity: 0.2; font-size: 7.6rem;}
#intro4 .right-c .cont{padding: 80px; background: url('/derma/images/sub/intro8-bg.webp')no-repeat; background-size: cover; color: #fff;}
#intro4 .right-c .cont .box:not(:last-child){margin-bottom: 90px;}
#intro4 .right-c .cont h3{position: relative; font-size: 3.6rem; font-weight: 800;}
#intro4 .right-c .cont h3:before{content: ''; position: absolute; width: 1px; height: 90%; left: -12px; top:5px; background-color: #fff; opacity: 0.4;}
#intro4 .right-c .cont .t1{font-size: 1.4rem;}
#intro4 .right-c .cont .t2{font-size: 1.4rem; margin: 20px 0;}
#intro4 .right-c .cont .tel{font-size: 4.9rem; font-weight: 900;}
#intro4 .right-c .cont dl{margin: 2% 0; display: flex; align-items: center; font-size: 1.8rem;}
#intro4 .right-c .cont dl dt{width: 120px; flex:0 0 auto;}
@media all and (max-width:1441px){
    #intro4{width: 94%;}
    #intro4 .left-c{width: 50%;}
    #intro4 .left-c img{max-width: 100%;}
    #intro4 .right-c .top p{font-size: 4.5vw;}
    #intro4 .right-c .cont{padding: 5vw;}
    #intro4 .right-c .cont .box:not(:last-child){margin-bottom: 5vw;}
}
@media all and (max-width:976px){
    #intro4 .left-c{width: 40%;}
    #intro4 .right-c{width: 60%;}
    #intro4 .right-c .cont dl{font-size: 1.6rem;}
    #intro4 .right-c .cont dl dt{width: 90px;}
    #intro4 .right-c .cont .tel{font-size: 4.0rem;}
}
@media all and (max-width:767px){
    #intro4{flex-direction: column-reverse;}
    #intro4 .left-c{width: 100%; margin-top: -20vw;}
    #intro4 .right-c{width: 100%; margin-left: 0; z-index: 2;}
    #intro4 .right-c .top p{padding-left: 0; font-size: 4.0rem;}
    #intro4 .right-c .cont h3{font-size: 3.0rem;}
    #intro4 .right-c .cont{padding: 8%;}
    #intro4 .right-c .cont dl dt{width: 70px;}
    #intro4 .right-c .cont .tel{font-size: 3.0rem;}
}










#introTitle h3 {font-size:60px; font-weight:200; color:#222}
#introTitle h3 br.br480 {display:none}
#introTitle .t1 {font-size:16px; margin-top:1.5em}

#introTitle.intro1-1 {margin-bottom:8em; }

@media all and (max-width:976px){
	#introTitle h3 {font-size:50px; }
}
@media all and (max-width:767px){
	#introTitle.intro3 h3 br {display:none }
}
@media all and (max-width:480px){
	#introTitle h3 {font-size:40px; }
	#introTitle.intro3 h3 br.br480 {display:block}
}
@media all and (max-width:360px){
	#introTitle.intro3-1 h3 br  {display:none}
}



#intro3Circle {padding-top:6em; width:90%; max-width:1280px; margin:5em auto 0; display:flex; justify-content:space-between;; position:relative}
#intro3Circle:before {content:'DIFFERENTIATION'; font-size:120px; color:#645894; opacity:.09; position:absolute; left:50%; top:0; transform:translateX(-50%); z-index:-1;  font-family: 'Marcellus', serif;}
#intro3Circle li {text-align:center}
#intro3Circle li:nth-child(2) {margin-top:30px}
#intro3Circle li .img {border-radius:100%; overflow:hidden}
#intro3Circle li dl {margin-top:3em;}
#intro3Circle li dl dt {font-size:28px; font-weight:600; color:#222}
#intro3Circle li dl dd {margin-top:0.5em; font-size:18px; }

@media all and (max-width:1280px){
	#intro3Circle { justify-content:center;;}
	#intro3Circle:before { font-size:11vw; }
	#intro3Circle li {width:31%; margin:1%;}
	#intro3Circle li .img img {width:100%}
	#intro3Circle li:nth-child(2) {margin-top:40px}
}
@media all and (max-width:640px){
	#intro3Circle {flex-wrap:wrap}
	#intro3Circle li {width:46%; margin:2%;}
	#intro3Circle li:nth-child(2) {margin-top:2%}
}
@media all and (max-width:480px){
	#intro3Circle li dl dt {font-size:24px;}
	#intro3Circle li dl dd { font-size:17px; }
}




#intro3BL {background:url('/images/sub/intro3-bl.png') no-repeat right 5%;}
@media all and (max-width:976px){
	#intro3BL {background:none }
}


#intro3List {margin:5em auto 0; display:flex; flex-wrap:wrap; gap:50px; justify-content:center;}
#intro3List > li {width:362px;}
#intro3List > li img {width:100%;}
#intro3List > li dl {margin-top:3em;}
#intro3List > li dl dt {font-size:28px; font-weight:600; color:#222; text-align:center}
#intro3List > li dl dd {margin-top:0.8em; font-size:17px; line-height:1.5em }




.dotList li {position:relative; margin-bottom:7px;}
.dotList li:before {content:''; width:4px; height:4px; border-radius:100%; background:#645894; position:absolute; left:0; top:10px;}
.dotList li p {padding-left:10px; line-height:1.4em; font-size:18px }




.sTitle {margin-bottom:5em}
.sTitle dt {font-size:50px; font-weight:200; color:#333; word-break: keep-all;}
.sTitle dd {margin-top:0.7em; font-size:17px; opacity:.7; line-height:1.6em; word-break: keep-all;}
.sTitle .point1 {margin-top:1em;  font-size:22px;  font-weight:600}
@media all and (max-width:480px){
	.sTitle {margin-bottom:2em}
	.sTitle dt {font-size:40px; }
	.sTitle dd {margin-top:0.7em; font-size:14px; }
}
@media all and (max-width:410px){
	.sTitle {margin-bottom:2em}
	.sTitle dt {font-size:3.5rem; }
}




.p-Part { padding:130px 0 ; }
.m-Part { margin:130px 0 ; }
.m-Part2 { margin:160px 0 ; }
.p-Part2 { padding:160px 0 ; }


@media all and (max-width:1280px){
	.p-Part { padding:100px 0 ; }
	.m-Part { margin:100px 0 ; }
	.m-Part2 { margin:130px 0 ; }
    .p-Part2 { padding:130px 0 ; }
}
@media all and (max-width:976px){
	.p-Part { padding:70px 0 ; }
	.m-Part { margin:70px 0 ; }
	.m-Part2 { margin:100px 0 ; }
    .p-Part2 { padding:100px 0 ; }
}
@media all and (max-width:480px){
	.p-Part { padding:50px 0 ; }
	.m-Part { margin:50px 0 ; }
	.m-Part2 { margin:80px 0 ; }
    .p-Part2 { padding:80px 0 ; }
}

#clinicTitle.tabTop {padding-bottom:6em}

#clinicTitle h3 {font-size:60px; line-height:1.2em; font-weight:200; color:#333; position:relative} 
#clinicTitle h3 .underline {position:relative }
#clinicTitle h3 .underline:before {content:''; width:100%; height:0.4em; background:rgba(100,88,148,0.15); position:absolute;left:0;bottom:5px;}
#clinicTitle .t1 {margin-top:2em; font-size:17px; line-height:1.6em}

#clinicTitle.intro4-1 > dl dt {margin-top: 2em;    font-size: 24px;   font-weight: 600;}
#clinicTitle.intro4-1 > dl dd {margin-top: 1em;    font-size: 17px;     line-height: 1.6em;    word-break: keep-all;}

@media all and (max-width:767px){
	#clinicTitle h3 {font-size:5rem; }
	#clinicTitle .t1 {margin-top:1em; font-size:16px }
}
@media all and (max-width:570px){
    #clinicTitle h3 {font-size:4rem; }
    #clinicTitle .t1 {font-size:14px }
}
@media all and (max-width:410px){
	#clinicTitle h3 {font-size:3rem; }
	#clinicTitle.derma1 .t1 br { display:none}
}

#clinicTop {height:415px; display:flex; flex-direction: row-reverse; align-items: end; position:relative; background-repeat:no-repeat; background-position:left top }
#clinicTop:after {content:''; width:12px; height:100%;  background:url('/images/sub/clinictop-txt.png')no-repeat left top; position:absolute; left:-25px; top:0}
#clinicTop .sTitle  {margin-bottom:3em}
#clinicTop .cont {padding:0 0 2em 4%; width:50%}
#clinicTop .cont .t1 { font-size:18px; line-height:1.8em; word-break: keep-all;}


#clinicTop.lifting1 { background-image:url('/petit/images/sub/clinictop-lifting1.png');}
#clinicTop.waxing1 { background-image:url('/petit/images/sub/clinictop-waxing1.png');}



@media all and (max-width:1399px){
	#clinicTop .cont .t1 br {display:none}
	#clinicTop:after {left:-5px; top:10px}
}
@media all and (max-width:1280px){
	#clinicTop {background-size:70% auto}
}
@media all and (max-width:976px){
	#clinicTop {height:auto; padding-top:46vw; background-size:90% auto; align-items: start; }
	#clinicTop .cont {padding:0; width:100%; background:#FFF}

}
@media all and (max-width:640px){
		#clinicTop {padding-top:60vw; background-size:120% auto}
}
@media all and (max-width:480px){
		#clinicTop .cont .t1 { font-size:16px;  }
}


#clinicTop2 {height:415px; display:flex; flex-direction: row-reverse; align-items: end; position:relative; background-repeat:no-repeat; background-position:left top; background-size:60% auto }
#clinicTop2:after {content:''; width:12px; height:100%;  background:url('/images/sub/clinictop-txt.png')no-repeat left top; position:absolute; left:-25px; top:0}
#clinicTop2 .sTitle  {margin-bottom:3em}
#clinicTop2 .cont {padding:0 0 2em 4%; width:40%}
#clinicTop2 .cont .t1 { font-size:18px; line-height:1.8em; word-break: keep-all;}


#clinicTop2.lifting1 { background-image:url('/petit/images/sub/clinictop-lifting1.png');}
#clinicTop2.waxing1 { background-image: url('/petit/images/sub/clinictop-waxing1.png?v=1');}



@media all and (max-width:1399px){
	#clinicTop2 .cont .t1 br {display:none}
	#clinicTop2:after {left:-5px; top:10px}
}
@media all and (max-width:1280px){
	#clinicTop2 {background-size:60% auto}
}
@media all and (max-width:976px){
	#clinicTop2 {height:auto; padding-top:46vw; background-size:90% auto; align-items: start; }
	#clinicTop2 .cont {padding:0; width:100%; background:#FFF}

}
@media all and (max-width:640px){
		#clinicTop2 {padding-top:60vw; background-size:120% auto}
}
@media all and (max-width:480px){
		#clinicTop2 .cont .t1 { font-size:16px;  }
}



#circleList ul {display:flex; gap:50px;justify-content:center;  }
#circleList ul li {width:340px;  text-align:Center}
#circleList ul.w4 li {width:340px; }
#circleList ul li .img img {width:100%; max-width:280px} 
#circleList ul li dl {margin-top:4em;}
#circleList ul li dl dt  {font-size:26px; font-weight:600; color:#333}
#circleList ul li dl dd  {margin-top:0.7em; font-size:18px; line-height:1.6em; word-break: keep-all;}


#circleList ul.w7 {flex-wrap:wrap}
#circleList ul.w7 li {width:300px; }



#circleList.derma4 ul li .img img {width:100%; max-width:190px} 

@media all and (max-width:1280px){
	#circleList ul.w5 {flex-wrap:wrap; }
	#circleList ul.w5 li {width:calc(33% - 50px); }
}
@media all and (max-width:1180px){
	#circleList ul.w4 li {width:calc(33% - 50px); }
	#circleList ul li .img img {width:100%;} 

}
@media all and (max-width:976px){
	#circleList ul.w4 {flex-wrap:wrap; gap:30px;}
	#circleList ul.w4 li {width:calc(50% - 50px); }

	#circleList ul.w5 {flex-wrap:wrap; gap:30px;}
	#circleList ul.w5 li {width:calc(50% - 50px); }

	#circleList ul li dl {margin-top:3em;}

	#circleList.derma4 ul {flex-wrap:wrap;  gap:30px;}
	#circleList.derma4 ul li {width:28%}
}
@media all and (max-width:680px){
	#circleList.derma4 ul li {width:40%}
}
@media all and (max-width:480px){
	#circleList ul.w4 li {width:80% }
	#circleList ul li dl {margin-top:2em;}
	#circleList ul li dl dd  {margin-top:0.7em; font-size:16px; }
}



#circleList.step ul li .img {position:relative}
#circleList.step ul li .img:before {content:''; width:12px; height:19px; background:url('/images/sub/derma4-arrow.png') no-repeat center; position:absolute; left:-32px; top:50%}
#circleList.step ul li:first-child .img:before {display:none}
#circleList.step ul li dt {font-size:22px}
#circleList.step ul li dl { margin-top:3em}

@media all and (max-width:976px){
	#circleList.derma ul {flex-wrap:wrap} 
	#circleList.step.derma4 ul li .img:before { left:-22px}
	#circleList.step.derma4 ul li dt {font-size:20px}
}




#solution {padding:5% 0;background:url('/petit/images/sub/solution-bg.png') no-repeat right top; background-size:cover}
#solution .m-inner {width:90%; max-width:1280px;}
#solutionCont {padding:60px 0 0 65px; width:90%; max-width:640px; height:740px; box-shadow:0 0 10px rgba(0,0,0,0.05); background:#FFF}
#solutionCont div {width:100%; height:100%; position:relative}
#solutionCont div .eng {font-size:18px; color:#9e9e9e; font-family: 'Marcellus', serif; letter-spacing:0}
#solutionCont div h3 {margin:0.7em 0 0.3em; font-size:50px; color:#645894; font-weight:200}
#solutionCont div .t1 {width:80%; font-size:17px; line-height:1.6em; position:relative; z-index:2}
#solutionCont div .bd-t {width:70%; margin-top:3em; display:flex; flex-wrap:wrap;  position:relative; z-index:2}
#solutionCont div .bd-t li  { margin:5px 5px 0 0; display:inline-block;  padding:0.5em 1em; font-size:18px; color:#b996a7; border:4px solid #f1e9ed; background:rgba(255,255,255,0.8); border-radius:50px;}
#solutionCont div .img {position:absolute;; right:0; bottom:0; z-index:1}
#solutionCont div div{margin-top: 2em; width: 65%; position: relative; z-index: 2; font-size: 1.6rem; line-height: 1.5;}
#solutionCont div div b{font-size: 1.7rem;}
#solutionCont .slick-prev,
#solutionCont .slick-next {bottom:40px; width:17px; height:10px; }
#solutionCont .slick-prev { padding-right:60px; border-right:1px solid #DDD; background:url('/petit/images/main/prev.webp') no-repeat left center; line-height: 1em;}
#solutionCont .slick-next { left:65px; margin-left:60px; padding-left:60px; margin-bottom:1px; background:url('/petit/images/main/next.webp') no-repeat right center; }

@media all and (max-width:1280px){
	#solution {background-position:60% top}
	#solutionCont {padding:40px 0 0 40px; height:640px;}
	#solutionCont div .eng {font-size:17px;}
	#solutionCont div h3 {margin:0.7em 0 0.4em; font-size:45px;}
	#solutionCont div .t1 {font-size:16px; }
	#solutionCont div .bd-t li  { font-size:17px; }
	
	#solutionCont .slick-next { left:40px; }
}
@media all and (max-width:1024px){
	#solution {background-position:60% top}
	#solutionCont { height:580px;}
	#solutionCont div .img {width:50%}
}
@media all and (max-width:640px){
	#solution {padding:10% 0;}
	#solution {background-position:70% top}
	#solutionCont div .img {width:60%}
	#solutionCont div h3 {font-size:40px;}
	#solutionCont div .bd-t {width:100%; margin-top: 0.5em;}
    #solutionCont div div{margin-top: 1em;}
}
@media all and (max-width:480px){
	#solutionCont {width:100%; padding:30px 0 0 20px; height:540px;}
	#solutionCont div .eng {font-size:14px;}
	#solutionCont div h3 {margin:0.5em 0 0.3em; font-size:35px; letter-spacing:-0.05em;}
	#solutionCont div .t1 {width:calc(100% - 20px); font-size:15px; }
	#solutionCont div .bd-t {width:100%;}
	#solutionCont div .bd-t li  { font-size:16px; }
	#solutionCont div .img { /* right:-20px; */} 
    #solutionCont div div{font-size: 1.5rem; margin-top: 0.7em;}
	
	#solutionCont .slick-next { left:20px; }
}






#numList ul {display:flex; flex-wrap:wrap}
#numList ul li { width:49%; margin:0.5%; border:1px solid #EEE; position:relative; counter-increment: number;}
#numList ul li:before {content: counter(number, decimal-leading-zero); display:flex; align-items: center; justify-content:center; 
						width:70px; height:100%; background:#645894; font-size:24px; font-weight:600; color:#FFF; 
						position:absolute; left:0; top:0 }
#numList ul li p { padding:25px 0 25px 90px;  font-size:17px}

@media all and (max-width:1280px){
	#numList ul li:before {width:60px}
	#numList ul li p { padding:20px 10px 20px 80px }
}
@media all and (max-width:976px){
	#numList ul li { width:100%; margin:0.5% 0;}
}
@media all and (max-width:480px){
	#numList ul li:before {width:40px; font-size:20px;}
	#numList ul li p { padding:15px 0 15px 50px;  font-size:15px}
}




#special { background:url('/petit/images/sub/special-bg.png') no-repeat left top; background-size:cover}
#special ul {display:flex; flex-wrap:wrap; gap:20px; justify-content:center;}
#special ul li {text-align:center;}
#special ul li .img { position:relative}
#special ul li .img:before {content:''; width:1px; height:80px; background:#645894; position:absolute; left:50%; bottom:-40px}
#special ul li dl {margin-top:60px}
#special ul li dl dt {font-size:20px; color:#645894;  font-family: 'Marcellus', serif;}
#special ul li dl dd {margin-top:0.7em; font-size:17px; word-break: keep-all;}

@media all and (max-width:680px){
	#special ul {gap:0; width:90%; margin:0 auto}
	#special ul li {width:48%; margin:1% 1% 5% 1%}
	#special ul li .img img {width:100%}
	#special ul li .img:before { height:60px;  bottom:-30px}
	#special ul li dl {margin-top:40px}
}
@media all and (max-width:480px){
	#special ul {gap:0; width:90%; margin:0 auto}
	#special ul li {width:47%; margin:1% 1.5% 5% 1.5%}
	#special ul li .img img {width:100%}
	#special ul li .img:before { height:50px;  bottom:-25px}
	#special ul li dl {margin-top:30px}
	#special ul li dl dt {font-size:18px;}
	#special ul li dl dd { font-size:15px; }
}





#circleListLine {display:flex; justify-content:center; gap:30px; }
#circleListLine li {width:280px; height:280px; border:1px solid rgba(100,88,148,0.2);  text-align:center; border-radius:100%; display:flex; align-items: center;  justify-content:center;   }
#circleListLine li > dl dt { margin-bottom:1em; font-size:18px; color:#645894;  font-family: 'Marcellus', serif;}
#circleListLine li > dl dd {font-size:24px; color:#222}


#circleListLine.intro4-1 {padding-top:8em}
#circleListLine.intro4-1 li > dl dd {font-size:26px; font-weight:500}
#circleListLine.intro4-1 li > dl .t1 { margin-top:1em; font-size:18px; line-height:1.6em;}

#circleListLine.intro3-1 { justify-content:left; gap:20px; }
#circleListLine.intro3-1 li {width:230px; height:230px; }
#circleListLine.intro3-1 li > dl {padding-left:0}
#circleListLine.intro3-1 li > dl dd {font-size:20px;}

#circleListLine.petit3 {flex-wrap:wrap; gap:20px}
#circleListLine.petit3 li {width:220px; height:220px; }

#circleListLine.intro3-3 {flex-wrap:wrap; gap:10px}
#circleListLine.intro3-3 li {width:220px; height:220px}
#circleListLine.intro3-3 li > dl dd {font-size:20px;}


@media all and (max-width:1480px){
	#circleListLine.intro3-1 { gap:10px; }
	#circleListLine.intro3-1 li {width:16vw; height:16vw; }
}
@media all and (max-width:1280px){
	#circleListLine.intro3-1 { gap:10px; justify-content:center; }
	#circleListLine.intro3-1 li {width:180px; height:180px; }

	#circleListLine.intro4-1 {gap:10px; justify-content:center;}
	#circleListLine.intro4-1 li {width:240px; height:240px; }
}
@media all and (max-width:1060px){
	#circleListLine.intro4-1 {flex-wrap:wrap; width:100%; max-width:767px}
	#circleListLine.intro4-1 li {width:280px; height:280px; }
}
@media all and (max-width:976px){
	#circleListLine.intro3-1 { flex-wrap:wrap; max-width:370px; margin:0 auto}
}
@media all and (max-width:640px){
	#circleListLine.intro4-1 { max-width:480px}
	#circleListLine.intro4-1 li {width:220px; height:220px; }
}
@media all and (max-width:480px){
	#circleListLine.intro3-1 li {width:37vw; height:37vw; }
	#circleListLine.intro3-1 li > dl dt { margin-bottom:0.5em; font-size:16px; }
	#circleListLine.intro3-1 li > dl dd {font-size:18px;}
	#circleListLine.intro3-3 li {width:45vw; height:45vw}

	#circleListLine.intro4-1 li {width:45vw; height:45vw; }
	#circleListLine.intro4-1 li > dl dt { margin-bottom:0.5em; font-size:16px; ;}
	#circleListLine.intro4-1 li > dl dd {font-size:22px;}
	#circleListLine.intro4-1 li > dl .t1 {margin-top:0.5em; font-size:16px}

}





#halfWrap {display:flex; padding-top:4em; margin-top:8em;  border-top:1px solid #DDD}
#halfWrap #title {width:300px; }
#halfWrap #title h3 {font-size:40px; font-weight:200; color:#645894}
#halfWrap #cont {width:calc(100% - 300px);}
#halfWrap #cont .in-box {margin-bottom:5em}
#halfWrap #cont h3 {font-size:28px; color:#222; font-weight:400 }
#halfWrap #cont > dl {padding-left:30px}
#halfWrap #cont > dl dt {font-size:20px; margin:20px 0; color:#222}
#halfWrap #cont > dl dt span {border-radius:30px; padding:0.2em 0.8em; margin-right:10px; background:#906692; color:#FFF; font-weight:400; display:inline-block}
#halfWrap #cont > dl dd {font-size:18px; line-height:1.6em }

#halfWrap #cont .in-box > dl dt {font-size:20px; margin:20px 0; color:#222}
#halfWrap #cont .in-box > dl dt span {border-radius:30px; padding:0.2em 0.8em; margin-right:10px; background:#906692; color:#FFF; font-weight:400; display:inline-block}
#halfWrap #cont .in-box > dl dd {font-size:18px; line-height:1.6em }


#halfWrap.intro3-1 #title { width:400px}
#halfWrap.intro3-1 #title h3 { color:#222}
#halfWrap.intro3-1 #cont {width:calc(100% - 400px);}
#halfWrap.intro3-1 #cont h4 {margin:2em 0 1em 0; font-size:24px; color:#222; font-weight:500 }
#halfWrap.intro3-1 #cont > dl {padding-left:0; margin-top:20px; }
#halfWrap.intro3-1 #cont > dl dt { font-size:28px; font-weight:600; color:#645894}
#halfWrap.intro3-1 #cont .img {margin:50px 0 30px}
#halfWrap.intro3-1 #cont .img  img {width:80%;}
#halfWrap.intro3-1 #cont .imglist {margin:30px 0 50px; display:flex; gap:10px; }
#halfWrap.intro3-1 #cont .imglist > li img {width:100% }

@media all and (max-width:1280px){
    #halfWrap {flex-wrap:wrap; padding-top:6em; margin-top:5em;}
	#halfWrap #title { width:100%; text-align:center}
	#halfWrap #title h3 { margin-bottom:1em; }
	#halfWrap #cont {width:100% ; text-align:center}

	#halfWrap.intro3-1 {flex-wrap:wrap; padding-top:6em; margin-top:5em;}
	#halfWrap.intro3-1 #title { width:100%; text-align:center}
	#halfWrap.intro3-1 #title h3 { margin-bottom:1em; }
	#halfWrap.intro3-1 #cont {width:100% ; text-align:center}
}
@media all and (max-width:480px){
    #halfWrap #title h3 {font-size:30px; }
	#halfWrap #cont > dl dt { font-size:24px; }


	#halfWrap.intro3-1 #title h3 {font-size:30px; }
	#halfWrap.intro3-1 #cont > dl dt { font-size:24px; }
}


#bdList {display:flex; flex-wrap:wrap; gap:10px;}
#bdList li {padding:1em 1.5em; width:calc(50% - 5px);  border-radius:50px; border:1px solid rgba(100,88,148,0.2); 
			font-size:18px; color:#222}
@media all and (max-width:1280px){
	#bdList.intro3-1 li {text-align:left}
}
@media all and (max-width:1280px){
	#bdList.intro3-1 li {width:calc(100% - 5px)}
}







#intro3-2 .in-box {display:flex; align-items: center; padding: 6em 0 6em }
#intro3-2 .in-box #imgWrap {width:960px}
#intro3-2 .in-box #imgWrap img {width:100%}
#intro3-2 .in-box #contWrap { width:calc(100% - 960px); padding-left: 80px; }
#intro3-2 .in-box #contWrap dl dt {font-size:40px; color:#645894; font-weight:500}
#intro3-2 .in-box #contWrap dl dd { font-size:18px; line-height:1.6em; margin-top:1em; }
#intro3-2 .in-box:nth-child(even) #imgWrap { order:2}
#intro3-2 .in-box:nth-child(even) #contWrap { order:1; padding-left:0; padding-right:80px;  text-align:right}

@media all and (max-width:1599px){
	#intro3-2 .in-box #contWrap dl dd  br {display:none}
}
@media all and (max-width:1499px){
	#intro3-2 .in-box #imgWrap {width:860px}
	#intro3-2 .in-box #contWrap { width:calc(100% - 860px); padding-left: 50px; }
	#intro3-2 .in-box:nth-child(even) #contWrap { padding-right:50px;}
}
@media all and (max-width:1280px){
	#intro3-2 .in-box #imgWrap {width:58%}
	#intro3-2 .in-box #contWrap { width:42%; }
	#intro3-2 .in-box:nth-child(even) #contWrap { }
}
@media all and (max-width:1024px){
	#intro3-2 .in-box {flex-wrap:wrap; padding: 6em 0 3em}
	#intro3-2 .in-box #imgWrap {width:100%}
	#intro3-2 .in-box #contWrap { width:100%; padding-left:0; text-align:center }
	#intro3-2 .in-box #contWrap dl {margin-top:3em}
	#intro3-2 .in-box:nth-child(even) #imgWrap { order:1}
	#intro3-2 .in-box:nth-child(even) #contWrap { padding-right:0; text-align:center; order:2}
}





.intro3-2-2-bg {background:#fffbfa;}

#intro3-2-2 {margin-top:6em; display:flex; gap:50px; justify-content:center; flex-wrap:wrap;}
#intro3-2-2 > li {text-align:center}
#intro3-2-2 > li img {width:90%; max-width:500px}
#intro3-2-2 > li dl {margin-top:4em}
#intro3-2-2 > li dl dt {font-size:30px; color:#645894; font-weight:500}
#intro3-2-2 > li dl dd { font-size:18px; line-height:1.6em; margin-top:1em; }

@media all and (max-width:480px){
	#intro3-2-2 > li dl dd br { display:none}
}





#intro3-3-3 { display:flex; flex-wrap:wrap;  justify-content:center; gap:50px }
#intro3-3-3 > li {width:350px; ;  margin-bottom:4em;}
#intro3-3-3 > li .img {width:280px; border-radius:100%; margin:0 auto; overflow:hidden}
#intro3-3-3 > li .img img {width:100%}
#intro3-3-3 > li dl {margin:3em 0 2em; padding-bottom:2em;  text-align:center; border-bottom:1px dashed rgba(100,88,148,0.2);}
#intro3-3-3 > li dl dt  { font-size:26px; font-weight:600; color:#333}
#intro3-3-3 > li dl dd  {margin-top:10px; font-size:20px; line-height:1.6em; word-break: keep-all; color:#645894; font-weight:500}
#intro3-3-3 > li .dotList {width:fit-content; margin:0 auto}

@media all and (max-width:976px){
	#intro3-3-3 {  gap:30px }
	#intro3-3-3 > li { margin-bottom:2em;}
}





#intro3-3List {margin-top:5em; display:flex; flex-wrap:wrap;}
#intro3-3List > li {width:46%; margin:3% 2%}
#intro3-3List > li img { width:100% }
#intro3-3List > li dl {margin-top:3em }
#intro3-3List > li dl dt  {margin-bottom:0.7em; font-size:26px; font-weight:600; color:#333}
#intro3-3List > li dl dd  {font-size:18px; line-height:1.6em; word-break: keep-all;}

@media all and (max-width:976px){
	#intro3-3List > li {width:100%;}
}






#intro3-4 dl {max-width:976px; display:table; margin-bottom:10px; margin:0 auto 10px}
#intro3-4 dl dt, #intro3-4 dl dd { padding:1.5em; display:table-cell; vertical-align:middle}
#intro3-4 dl dt {font-size:22px; font-weight:500; width:200px; text-align:center; background:#645894; color:#FFF}
#intro3-4 dl dd {width:calc(976px - 200px); font-size:18px;  border:1px solid rgba(100,88,148,0.2); }

@media all and (max-width:976px){
	#intro3-4 dl {width:90%; display:block }
	#intro3-4 dl dt, #intro3-4 dl dd  {width:100%; display:block; }
	#intro3-4 dl dt {padding:0.7em }
	#intro3-4 dl dd { text-align:center}
}




#intro3-4-2 {display:flex; flex-wrap:wrap; justify-content:center; gap:50px;}
#intro3-4-2 li {width:250px; text-align:center}
#intro3-4-2 li .icon {width:180px; height:180px; margin:0 auto;  border-radius:100%;  border:1px solid rgba(100,88,148,0.2); display:flex;  align-items: center;justify-content:center;}
#intro3-4-2 li p {font-size:20px; margin-top:1em; color:#222 ; line-height:1.4em; font-weight:500}

@media all and (max-width:976px){
	#intro3-4-2 { gap:20px;}
	#intro3-4-2 li {width:180px;}
}
@media all and (max-width:480px){
	#intro3-4-2 { gap:10px;}
	#intro3-4-2 li {width:150px; }
	#intro3-4-2 li .icon {width:130px; height:130px; } 
	#intro3-4-2 li p {margin-top:0.5em; }
}






#intro1-2-title {display:flex; justify-content:space-between; margin:0 0 -45px 2em; position:relative; z-index:3}
#intro1-2-title dt {font-size:100px;   font-family: 'Marcellus', serif;}
#intro1-2-title dd {font-size:22px; color:#222; padding:1.5em 0 0 2em}

@media all and (max-width:1280px){
	#intro1-2-title { margin:0 0 -35px 2em; }
	#intro1-2-title dt {font-size:80px; }
	#intro1-2-title dd {font-size:20px; padding:1.0em 0 0 2em}
}
@media all and (max-width:1024px){
	#intro1-2-title {display:block; text-align:center;  margin:0 auto 4em ;  }
	#intro1-2-title dt {font-size:70px; }
	#intro1-2-title dd {padding:0; margin-top:0.3em; }
}
@media all and (max-width:640px){
	#intro1-2-title dt {font-size:50px; }
	#intro1-2-title dd {font-size:18px; }
}


#intro1-2 {margin-bottom:7em; position:relative; z-index:3}

#intro1-2 .title > h3 {font-size:60px; font-weight:200; line-height:1.2em; color:#222; position:relative }
#intro1-2 .title .t1 {margin-top:1.5em; font-size:16px; line-height:1.6em }


#intro1-2 #hour {width:fit-content; background:#645894; padding:5em; color:#FFF; display:flex; 
						position:absolute; right:0; bottom:-130px}
#intro1-2 #hour h3 {padding-right:50px; font-size:30px; }
#intro1-2 #hour .time dl {display:flex; font-size:17px; margin:5px 0}
#intro1-2 #hour .time dl dt  {width:80px}
#intro1-2 #hour .time dl dd  {width: calc(100% - 80px)}


#sMap {}
#sMap .root_daum_roughmap .wrap_controllers {display:none}
#sMap .root_daum_roughmap .wrap_map {height:430px}

#sLocation {width:fit-content; margin-top:8em}
#sLocation ul {margin-bottom:5em; display:flex}
#sLocation ul h4 {width:200px; font-size:40px; font-weight:200; color:#222}
#sLocation ul li {width:calc(100% - 200px); font-size:17px; line-height:1.6em}
#sLocation ul li > dl {	display:flex; width:100%; border-bottom:1px dashed rgba(100,88,148,0.2); 
							padding-bottom:0.7em; margin-bottom:0.7em}
#sLocation ul li > dl dt {width:230px; color:#222; font-weight:400}
#sLocation ul li > dl dd {width:calc(100% - 230px ); }
#sLocation ul li > dl dd span {padding-right:20px; display:inline-block}


@media all and (max-width:1280px){
	#intro1-2 {padding-bottom:130px}
}
@media all and (max-width:1130px){
	#sLocation {width:90%}
	#sLocation ul h4 {width:150px; }
	#sLocation ul li {width:calc(100% - 150px); }
	#sLocation ul li > dl dt {width:200px;}
	#sLocation ul li > dl dd {width:calc(100% - 200px )}
}
@media all and (max-width:976px){
	#intro1-2 .title > h3 {font-size:40px; }
	#intro1-2 {padding-bottom:0}
	#intro1-2 #hour { margin-top:6em; position:unset; }

	#sLocation ul {flex-wrap:wrap}
	#sLocation ul h4 {width:100%; margin-bottom:20px }
	#sLocation ul li {width:100%}
}

@media all and (max-width:640px){
	#intro1-2 #hour {flex-wrap:wrap;} 
	#intro1-2 #hour h3 {margin-bottom:8px; padding-right:0; width:100% }
	#intro1-2 #hour .time  {width:100%}
	
	#sLocation ul li > dl.bus {flex-wrap:wrap}
	#sLocation ul li > dl.bus dt {width:100%; margin-bottom:5px}
	#sLocation ul li > dl.bus dd {width:100%}
}












#suggest {margin-top:8em; height:500px; background:url('/images/sub/intro4-1-bg.webp')no-repeat center center; background-attachment: fixed; }
#suggest ul {height:100%;  display: flex; align-items: center;  justify-content: space-evenly;}
#suggest ul li { }
#suggest ul li a {display:block; width: 100%; height: 100%; text-align:center}
#suggest ul li .top {margin-bottom:3em; }
#suggest ul li .top img {width:100%; max-width:100px}
#suggest ul li .bottom{position: relative; color:#FFF}
#suggest ul li .bottom h3{ font-size:32px ;  font-weight: 600; margin-bottom: 10px }
#suggest ul li .bottom p{ margin-bottom:2em; font-size: 17px; line-height:1.6em; opacity:.5}
#suggest ul li .bottom span{ padding:0.7em 2em; font-size: 18px; color: #FFF; font-weight: bold; border: 1px solid #FFF;  border-radius: 100px; text-align: center; line-height: 50px;}
#suggest ul li .bottom span i {padding-left:1em; font-size:15px; }
#suggest ul li a:hover h3 {text-decoration:underline; text-decoration-thickness:1px; }
#suggest ul li a:hover span {background:#FFF; color:#222; transition: all 0.3s ease-out;}

@media screen and (max-width:1380px){
    #suggest ul li a{padding: 30px 20px;}
}
@media screen and (max-width:1280px){
    #suggest ul li .bottom h3{ font-size: 2rem;}
    #suggest ul li .bottom p{ font-size: 1.5rem;}
    #suggest ul li .bottom span{ font-size: 12px; width: 20px; height: 20px; line-height: 20px;}
}
@media screen and (max-width:1080px){
    #suggest ul li{width: 100%; margin-bottom: 20px;}
    #suggest ul li .top{width: 15%;}
    #suggest ul li .top img{width: 100px;}
    #suggest ul li .bottom{width: 80%;}
}
@media screen and (max-width:740px){
    #suggest ul li .top{width: 15%;}
    #suggest ul li .top img{width: 100%;}
    #suggest ul li .bottom{width: 80%;}
}
@media screen and (max-width:500px){
    #suggest ul li .top{width:50px;}
    #suggest ul li .top img{width: 100%;}
    #suggest ul li .bottom{width: calc(100% - 70px);}
}




.layer{position:fixed; display:none; left:0;top:180px; z-index:3000000; width:100%;}
.layer .close_btn{position:absolute; overflow: hidden; right:10px; top:10px;}
.layer .close_btn a{display: block;color: #fff; font-size:20px; font-weight:bold;  width:50px; height:50px; line-height:50px; text-align:center;  background:#645894;  border-radius:50px }
.layer .layer_wrap{position:relative;width:96%; max-width:900px; top:0px; margin:0 auto; border-radius:5px; background: #fff; text-align:left; letter-spacing:-0.5px; box-shadow:0 0 10px rgba(0,0,0,0.2);}
.layer .layer_wrap .DB_info_detail{width:100%;  margin:18px auto; padding-bottom:16px; line-height:18px; color: #333;font-size:12px;}
.layer .layer_wrap .DB_info_detail h2{padding:28px 20px;border-bottom:1px solid #eee; font-size:24px; font-weight:bold;  text-align:center}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap p{padding:8px;margin-bottom:12px; font-size:13px;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap{width:98%; height:360px; padding:1em 3em; overflow:auto; box-sizing:border-box;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap dl dt{display:block; background: #eee;border-radius:3px; padding:7px 10px; font-weight: bold;}
.layer .layer_wrap .DB_info_detail .DB_info_detail_wrap dl dd{margin-bottom:16px; padding:4px 12px; box-sizing:border-box;}

.select-cus {  display: inline-block;  width: 260px;  height: 48px;  border: solid 1px #c4ccd8;  background-color: #ffffff;  box-sizing: border-box;  
				font-size: 16px; font-family:'SUIT';  cursor: pointer;  position: relative;   outline: 0px;}
/* input {height:46px; box-sizing: border-box; background:rgba(88,96,148,0.1); border-radius:50px; padding: 0 20px; font-size:16px;  font-family:'SUIT'; } */
input:focus {outline: none; border-bottom: 1px solid #000; color: #555555; }
textarea:focus {outline: none;   ;color: #555555;;}
.contact { width: 50%; margin: 30px 0;}
.contact  > div { margin-bottom: 20px; display: flex;}
.contact  h5{width: 150px; font-size: 18px;}
.contact  #text{border: 0  ;width: calc(100% - 150px); }
.contact  #exp{border: 0;  padding:20px ; height:230px; width: calc(100% - 150px); ; background:rgba(88,96,148,0.1); font-size: 16px;  font-family:'SUIT'}
.contact  .phone{width: 100%;}
.contact  .phone-num{display: inline-block; position: relative; text-align: center;}
.contact  .phone-num span{margin: 5px;}
.contact  #tel_text{border: 0;  max-width: 80px; text-align: center;}
.contact  .button{width: 90px;margin: 0 auto; text-align: center;}
.contact  #but{ border: 0; display:inline-block; font-size: 20px; cursor: pointer;background: #333; color: #fff; font-family:'SUIT'}
.contact  #but:hover {background: #645894; transition: all 0.3s ease-out; }
.contact  .agree{text-align: center; margin-bottom: 20px;}
.contact  .agree h5{margin-bottom: 0;}
.contact  .agree label{display: inline-block; padding-left: 10px; vertical-align: top;}

@media screen and (max-width:540px){
    .contact  h5{width: 90px; }
    .contact  #text{width:calc(100% - 90px);}
    .contact  #exp{width: calc(100% - 90px);}
	.contact  #tel_text{  max-width: 70px; padding:0 5px}
}

@media screen and (max-width:480px){
	.contact  > div  {flex-wrap:wrap}
	.contact  > div h5 {width:100%; margin-bottom:10px}
	.contact  #text{width:100%;}
    .contact  #exp{width: 100%;}
}








#petit8Circle {display:flex; justify-content:center; gap:50px}
#petit8Circle li {text-align:Center}
#petit8Circle li h4 {background:#645894;  padding:0.4em 1.5em; display:inline-block; color:#FFF;
					margin-top:0.7em; font-size:22px; font-weight:500; border-radius:30px; }

@media all and (max-width:1280px){
	#petit8Circle li .img {width:230px}
	#petit8Circle li .img img {width:100%}
}
@media all and (max-width:976px){
	#petit8Circle {gap:0}
	#petit8Circle li  {width:31%; margin:1%  }
	#petit8Circle li .img {width:100%}
	#petit8Circle li .img img {width:100%}
}
@media all and (max-width:480px){
	#petit8Circle li h4 {font-size:19px;  padding:0.3em 1.0em;}
}




#petit8Cont {width:90%; max-width:1024px; margin:5em auto 0 ; text-align:center}
#petit8Cont .t1 {margin-bottom:1em; font-size:18px; line-height:1.8em; }
#petit8Cont .t2 { font-size:20px; text-decoration:underline; color:#645894; font-weight:500; display:inline-block;
					text-decoration-thickness:1px}





.tabs { display: flex; align-items: stretch; justify-content: center; margin: 4em 0; text-align: center;}
.tabs li { background:#f8f6f8; width: 20%; ; border-radius:50px; margin:3px; }
.tabs li a { display: block; padding: 1.2em 0; color:#906692; font-size: 18px; font-weight:400; }
.tabs li.active {background: #906692; }
.tabs li.active a { opacity:1; font-weight: 600; color:#FFF }
.tab_content .titCont:first-child { padding-top: 1em; }

@media all and (max-width:767px) {
  .tabs li {  width: 28% ;}
  .tabs li a { padding: 0.8em 0}
}
@media all and (max-width:480px) {
  .tabs  { margin: 2em 0; }
  .tabs li {  width: 35% ;}
}




#t-Style {width:100%}
#t-Style tr th {padding:1.2em 0;font-size:20px; border-top:2px solid #906692; border-bottom:1px solid #e3e3e3; background: #f9f8f9; color:#906692; text-align:center; border-right:1px solid #e3e3e3 }
#t-Style tr td {padding:1.1em 0; border-bottom:1px solid #e3e3e3; border-right:1px solid #e3e3e3; text-align:center; font-size:17px;}
#t-Style tr th:last-child,
#t-Style tr td:last-child {border-right:0}
#t-Style tr td.fd-f {border-left:0}

@media all and (max-width:480px) {
	#t-Style tr th {font-size:18px }
	#t-Style tr td {font-size:16px }
}






#petit2-img {text-align:center}
#petit2-img img {width:90%; max-width:430px}
#petit2-img .t1 { margin:3em 0 1em; font-size:24px; color:#333}
#petit2-img .t2 {max-width:1024px; font-size:18px; line-height:1.8em; margin:0 auto}




#petit4-img {text-align:center}
#petit4-img img {max-width:800px; width:100%}
#petit4-img .t1 { margin:3em 0 1em; font-size:24px; color:#333}
#petit4-img .t2 {max-width:1024px; font-size:18px; line-height:1.8em; margin:0 auto}


#lifting9-img {text-align:center}
#lifting9-img img {max-width:800px; width:100%}
#lifting9-img .t1 {display: inline-block; margin:1em 0; padding: 0.4em 1.5em; font-size:24px; color:#fff; background-color: #52419d; border-radius: 40px;}
#lifting9-img .t2 {max-width:1024px; font-size:18px; line-height:1.8em; margin:0 auto}