@charset "utf-8";




.mVisual {width:calc(100% - 40px);  height:calc(100vh - 110px - 20px); margin:0 auto; position:relative; }
.mVisual .visual{width: 100%; height: 100%;}
.mVisual .visual > div{height: 100%;}
.mVisual .visual > div > div{height: 100%; }
.mVisual .visual .mv{ border-radius:30px; background-repeat: no-repeat; background-position: center center; background-size: cover; height: 100%;}
.mVisual .visual .mv.mv1{background-image: url('/images/main/m_visual1.png');}
.mVisual .visual .mv.mv2{background-image: url('/images/main/m_visual2.webp?v=2'); background-position: 83% 50%;}

.mVisual .visual .mv .txt{padding-bottom:80px; display: flex; display: flex; align-items: end; height: 100%; }
.mVisual .visual .mv .txt h3 {font-size:7.0rem; color:#FFF; font-weight:normal; font-family: 'DwImpactamin'; line-height:1.3em}
.mVisual .visual .mv .txt h3 .point {color:#b7e6ff}
.mVisual .visual .mv .txt .t1 {margin-top:1em; font-size:2.2rem; color:#FFF; font-family: 'OneStoreMobileGothicTitleFont';}

.mVisual .visual .progress {margin-top:80px; display: flex; align-items: center; gap: 25px;}
.mVisual .visual .progress .gague{width: 200px ; height: 3px; background-color: rgb(255, 255, 255, 0.3); }
.mVisual .visual .progress .gague .bar{height: 100%; background-color: #fff;}

.mVisual .visual .progress .arrows{display: flex; gap: 30px; color: #fff; font-family: 'SUIT'; font-size: 1.6rem;  font-weight:700; position:relative}
.mVisual .visual .progress .arrows:before {content:''; width:4px; height:4px; background:rgba(255,255,255,0.5); border-radius:50px;position:absolute; left:50%; top:50%; transform:translate(-50%, -50%)}
.mVisual .visual .progress .arrow{cursor: pointer;}

.mVisual .visual .progress .nums{display: flex; align-items: center; gap: 5px;}
.mVisual .visual .progress .num,  
.mVisual .visual .progress .lash{font-size: 1.6rem; font-family:'Roboto'; font-weight: 700; color: #fff;}

.mVisual .visual .progress .num.all, 
.mVisual .visual .progress .lash{opacity: 0.5;}


@media all and (max-width:1400px){
    .mVisual .visual .mv .txt h3{font-size:6.0rem;}
	.mVisual .visual .progress .gague{width: 160px}
}
@media all and (max-width:768px){
	.mVisual {width:96% }
	.mVisual .visual .mv{ border-radius:10px;}
    .mVisual .visual .mv.mv2{background-image: url('/images/main/m_visual2_mo.webp'); background-position: right top;}
	.mVisual .visual .mv .txt{padding-bottom:50px;}
	.mVisual .visual .mv .txt h3{font-size:4.0rem;  line-height:2.2em} 	
	.mVisual .visual .mv .txt h3 p {font-size:1.7em}
	.mVisual .visual .mv .txt .t1 {margin-top:2em; font-size:2.0rem;}

	.mVisual .visual .mv.mv1{background-position:70% center}
}
@media all and (max-width:480px){
	.mVisual .visual .mv .txt {text-align:center; padding-bottom:8vw}

	.mVisual .visual .mv .txt h3 {font-size:2.8rem; margin-bottom:0;}
	.mVisual .visual .mv .txt .t1 {font-size:1.6rem;}

	.mVisual .visual .progress {justify-content:center; }
	.mVisual .visual .progress .gague{width: 100px }
}





#mTitle {margin-bottom:80px; text-align:center}
#mTitle h2 {font-size:6.0rem; font-weight:normal; color:#333; line-height:1.4em; font-family: 'DwImpactamin';}
#mTitle h3 {font-size:4.8rem; font-weight:normal; color:#333; line-height:1.4em; font-family: 'DwImpactamin';}
#mTitle h4 {font-size:3.0rem; margin-bottom:0.6em; font-weight:normal; color:#333; font-family: 'DwImpactamin';
				line-height:1.4em}
#mTitle .t1 {font-size:1.8rem; padding-top:1.3em; line-height:1.6em; opacity:.7}

@media all and (max-width:1400px){
	#mTitle h2 {font-size:5.8rem;}
	#mTitle h4 {font-size:2.6rem;}
	#mTitle h3 {font-size:4.2rem; }
}
@media all and (max-width:1280px){
	#mTitle h2 {font-size:5.5rem;}
}
@media all and (max-width:976px){
#mTitle {margin-bottom:50px; }
}
@media all and (max-width:640px){
	#mTitle h2 {font-size:4.8rem;}
}
@media all and (max-width:480px){
	#mTitle {margin-bottom:10vw}
	#mTitle h2 {font-size:4.0rem; letter-spacing:-0.03em}

	#mTitle h4 {font-size:2.2rem;}
	#mTitle h3 {font-size:3.2rem; }
	#mTitle .t1 {font-size:1.6rem;} 
}





#mIntro {overflow:hidden; position:relative; background:url('/images/main/mintro-bg1.png') no-repeat center center}
#mIntro:before {content:''; width:1090px; height:1090px; position:absolute; left:50%; top:50%; 
					transform:translate(-50%, -50%) rotate(0deg); animation:mIntroRotate 20s linear infinite; will-change:transform;
					background:url('/images/main/mintro-bg2.png') no-repeat center center / cover; z-index:-1; }
#mIntro #mTitle {margin-bottom:0}
#mIntro #mTitle ul {margin-top:2em;}
#mIntro #mTitle ul li.t2 {font-size:2.0rem; line-height:2.0em }
#mIntro #mTitle .tit {margin-top:2em; font-size:2.2rem; color:#333; font-family: 'OneStoreMobileGothicTitleFont';}

@keyframes mIntroRotate {
	from { transform:translate(-50%, -50%) rotate(0deg); }
	to { transform:translate(-50%, -50%) rotate(360deg); }
}

@media all and (max-width:1024px){
	#mIntro {background-size:86% auto}
	#mIntro:before { width:96%; height:90%;  animation:mIntroRotate 15s linear infinite;}
}
@media all and (max-width:480px){
	#mIntro #mTitle ul {margin-top:1.0em;}
	#mIntro #mTitle ul li.t2 {font-size:1.8rem; line-height:1.8em}
	#mIntro #mTitle .tit { font-size:2.0rem;}
}







#mClinic {display:flex; gap:10px}
#mClinic #box {width:calc((50% - 10px *3)/4); height:520px; border-radius:10px; overflow:hidden; 
					background:no-repeat center center / cover; position:relative; transition:width 0.7s cubic-bezier(.25,1,.5,1)}
#mClinic #box:before {content:''; width:100%; height:100%; position:absolute; left:0; top:0; backdrop-filter:blur(5px); 
							background:rgba(0,0,0,0.3); transition:all 0.6s cubic-bezier(.25,1,.5,1)}
#mClinic #box a {width:100%; height:100%; position:relative; display:flex; justify-content:center; align-items:center; 
					box-sizing:border-box}
#mClinic #box .off {position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%; text-align:center; 
						transition:all 0.5s cubic-bezier(.25,1,.5,1)}
#mClinic #box .off li.icon {width:120px; height:120px; border-radius:100%; background:rgba(255,255,255,0.17); margin:0 auto}
#mClinic #box .off li.icon img {width:100%}
#mClinic #box .off li.txt {padding-top:0.5em; font-size:3.0rem; font-family:'OneStoreMobileGothicTitleFont'; color:#FFF}
#mClinic #box .on {width:90%; max-width:800px; position:absolute; left:60px; right:60px; bottom:60px; opacity:0; visibility:hidden; transform:translateY(30px); 
						transition:all 0.6s cubic-bezier(.25,1,.5,1)}
#mClinic #box .on dl dt {font-size:4.0rem; font-family:'OneStoreMobileGothicTitleFont'; color:#FFF }
#mClinic #box .on dl dd {margin-top:1em; line-height:1.6em; color:#FFF }


#mClinic #box.active {width:50%; position:relative}
#mClinic #box.active:before {height:50%; top:unset; bottom:0; backdrop-filter:blur(0);
	background:linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 45%, rgba(0,0,0,0) 80%)}
#mClinic #box.active .on {opacity:1; visibility:visible; transform:translateY(0)}
#mClinic #box.active .off {opacity:0; transform:translate(-50%, -60%)}

#mClinic #box.bg1 {background-image:url('/images/main/mclinic-bg1.jpg')}
#mClinic #box.bg2 {background-image:url('/images/main/mclinic-bg2.jpg')}
#mClinic #box.bg3 {background-image:url('/images/main/mclinic-bg3.jpg')}
#mClinic #box.bg4 {background-image:url('/images/main/mclinic-bg4.jpg')}
#mClinic #box.bg5 {background-image:url('/images/main/mclinic-bg5.jpg')}

@media all and (max-width:1280px){
	#mClinic #box {height:420px; }
	#mClinic #box .off li.icon {width:8vw; height:8vw}
	#mClinic #box .off li.txt {font-size:2.5rem;}
	#mClinic #box .on {left:30px; right:30px; bottom:30px; }
	#mClinic #box .on dl dt {font-size:3.5rem;}
	#mClinic #box .on dl dd {line-height:1.4em; }
	#mClinic #box.active:before {height:60%; }
}
@media all and (max-width:1024px){
	#mClinic #box {height:380px; }
	#mClinic #box.active:before {height:70%; }
}
@media all and (max-width:976px){
	#mClinic {flex-wrap:wrap; gap:5px 0}

	#mClinic #box {width:100%; height:100px; }
	#mClinic #box .off {display:flex; width:auto;  justify-content:center; align-items: center; gap:0 10px}
	#mClinic #box .off li.icon {width:80px; height:80px}
	#mClinic #box .off li.txt {padding-top:0}
	#mClinic #box.active {width:100%; height:380px; overflow:hidden}
}
@media all and (max-width:480px){
	#mClinic #box { height:auto; }
	#mClinic #box a {padding:9vw 0}
	#mClinic #box .off li.icon {width:12vw; height:12vw}
	#mClinic #box .off li.txt {font-size:2.0rem;}	
	#mClinic #box .on {left:5vw; right:5vw; bottom:5vw; }
	#mClinic #box .on dl dt {font-size:2.8rem; }
	#mClinic #box.active { height:90vw}
}




#mRobot {position:relative; margin-top:100px}
#mRobot .sb {position:absolute; left:50%; top:0; transform:translate(-50%, -50%); z-index:33}
#mRobot .sb img {width:100%}
#mRobot .robotSlick {background:#f3f3f3}
#mRobot .in {background:no-repeat right top / auto 100%}
#mRobot .in .inner {padding:100px 0; display:flex; }
#mRobot .in .cont {width:600px; padding-right:10%; padding-top:4%}
#mRobot .in .cont h4 {font-size:2.4rem; padding-bottom:0.6em; color:#333; font-family:'OneStoreMobileGothicTitleFont'; 
							font-weight:normal}
#mRobot .in .cont h3 {font-size:4.6rem; color:#333 ;font-family:'OneStoreMobileGothicTitleFont'; font-weight:normal}
#mRobot .in .cont .t1 {margin:1em 0 2em; line-height:1.8em;}
#mRobot .in .cont .t2 {display:flex; flex-wrap:wrap; gap:5px}
#mRobot .in .cont .t2 p {padding:0.4em 1em; background:#deedf5; color:#2c89bb; font-weight:600; border-radius:5px }
#mRobot .in .img {border-radius:10px; overflow:hidden}
#mRobot .in .img img {width:100%}

#mRobot .in.bg1 {background-image:url('/images/main/mrobot-bg1.png')}
#mRobot .in.bg2 {background-image:url('/images/main/mrobot-bg2.png')}

#mRobot .robotArrow {position:absolute; left:50%; top:50%; transform:translateX(-50%); width:100%; max-width:1600px; 
							margin-top:170px; display:flex; gap:5px; z-index:30;}
#mRobot .robotArrow button {width:58px; height:58px; border-radius:100%; 
									background:#FFF; backdrop-filter:blur(10px); cursor:pointer; font-size:0; 
									position:relative; transition:all 0.3s ease}
#mRobot .robotArrow button:hover {background:#21418e}
#mRobot .robotArrow button:before {content:''; width:10px; height:10px; position:absolute; left:50%; top:50%; 
												border-top:2px solid #333; border-left:2px solid #333; transition:all 0.3s ease}
#mRobot .robotArrow button:hover:before {border-color:#FFF}
#mRobot .robotArrow .robotPrev:before {transform:translate(-35%, -50%) rotate(-45deg)}
#mRobot .robotArrow .robotNext:before {transform:translate(-65%, -50%) rotate(135deg)}

@media all and (max-width:1600px){
	#mRobot .robotArrow { width:90%}
}
@media all and (max-width:1280px){
	#mRobot .in .cont {width:500px; padding-right:8%}
	#mRobot .in .cont h3 {font-size:3.5rem;}
	#mRobot .in .img {width:280px}
}
@media all and (max-width:1024px){
	#mRobot .in .inner {justify-content:space-between; }
	#mRobot .in.bg1,
	#mRobot .in.bg2 {background-image:none}
}
@media all and (max-width:976px){
	#mRobot .in .inner {padding:100px 0; flex-wrap:wrap; margin-bottom:50px}
	#mRobot .in .inner .cont {width:100%; text-align:center; padding:0; margin-top:2em; order:2 }
	#mRobot .in .cont .t2 {  justify-content:center }
	#mRobot .in .inner .img {margin:0 auto; order:1}
	#mRobot .robotArrow button {width:50px; height:50px;}
	#mRobot .robotArrow {width:auto; top:unset; bottom:50px; margin-top:0; }
}
@media all and (max-width:480px){
	#mRobot .sb {width:60%; margin:0 auto}
	#mRobot .in .inner { margin-bottom:8vw}
	#mRobot .in .inner .img {width:60%}
	#mRobot .robotArrow {bottom:15vw; }
	#mRobot .robotArrow button {width:10vw; height:10vw}
	#mRobot .in .cont h4 {font-size:2.2rem;}
	#mRobot .in .cont h3 {font-size:3.0rem;}
}



.mScrollWrap {display:flex; height:100vh; position:relative; overflow:hidden}
.mScrollWrap .bg {width:50%; background:no-repeat center center / cover; transform:scale(1.15); transform-origin:center center; will-change:transform}
.mScrollWrap .cont {width:50%; display:flex; flex-direction:column; justify-content:center; align-items:center; background:#FFF; position:relative; z-index:2}


.mScrollWrap .cont #mTitle {margin-bottom:30px}
.mScrollWrap .cont #mTitle h4 {font-size:2.6rem;}
.mScrollWrap .cont .txt {width:90%; max-width:560px;}
.mScrollWrap .cont .txt img {width:100%}
.mScrollWrap .cont .txt dl dt {font-size:2.8rem; padding-top:1.5em; font-family:'OneStoreMobileGothicTitleFont'; color:#333}
.mScrollWrap .cont .txt dl dd {margin:1em 0 2em; line-height:1.8em}
.mScrollWrap .bg.care1 {background-image:url('/images/main/mcare-bg.png')}
.mScrollWrap .bg.health1 {background-image:url('/images/main/mhealth-bg.webp')}

#mBtn a {padding:0.7em 0; border-radius:50px; display:inline-block; font-weight:600; color:#333; transition: all 0.1s;}
#mBtn a span {font-family:'SUIT'; font-weight:900; padding-left:1em; }
#mBtn a:hover {padding:0.7em 1em; background:#21418e ; color:#FFF}

@media all and (max-width:1400px){
	.mScrollWrap .bg {width:45%;}
	.mScrollWrap .cont {width:55%;}
	.mScrollWrap .cont .txt { max-width:480px;}
	.mScrollWrap .cont .txt dl dd {line-height:1.6em}
}
@media all and (max-width:976px){
	.mScrollWrap {flex-wrap:Wrap; height:auto; background:#FFF}
	.mScrollWrap .bg {width:100%; height:70vw}
	.mScrollWrap .cont {width:100%; margin:80px 0 }
	.mScrollWrap .cont .txt { max-width:480px;}
	.mScrollWrap .cont .txt dl dd {line-height:1.6em}
}
@media all and (max-width:480px){
	.mScrollWrap .cont #mTitle h4 {font-size:2.0rem;}
	.mScrollWrap .cont { margin:10vw 0 20vw; padding:0 5% }
	.mScrollWrap .cont .txt dl dt {font-size:2.4rem; }
}






#mDoctor {background:#f7f7fa; position:relative; overflow:hidden }
#mDoctor #mTitle { position:relative}

#slickWrap { display:flex;}
#slickWrap .slider-cont {width:1120px;  background:#FFF;; }
#slickWrap .slider-cont .cont {width:100%; display:flex}
#slickWrap .slider-cont .img {width:450px}
#slickWrap .slider-cont .img img {width:100%; }
#slickWrap .slider-cont .txt { width:calc(100% - 450px); padding:0 100px 0 70px;
									background:url('/images/main/mdoctor-txt-bg.png') no-repeat right top / auto 100%;
									display:flex; flex-direction: column;  justify-content:center; } 
#slickWrap .slider-cont .txt h3 {font-size:3.0rem; margin-bottom:1em; color:#333; line-height:1.2em; font-weight:400; 
									position:relative}
#slickWrap .slider-cont .txt h3:before {content:''; width:52px; height:32px; position:absolute; left:-40px; top:-14px;
									background:url('/images/main/mdoctor-tta.png') no-repeat right top / 100% auto}
#slickWrap .slider-cont .txt dl {font-family:'OneStoreMobileGothicTitleFont'; display:flex; align-items: end;}
#slickWrap .slider-cont .txt dl dt {font-size:3.4rem; color:#333; font-family:'OneStoreMobileGothicTitleFont'; }
#slickWrap .slider-cont .txt dl dd {color:#d1d3d4; font-weight:normal}
#slickWrap .slider-cont .txt .his {padding:1.5em 0 3em; display:flex; gap:0 30px; border-bottom:2px solid #f2f3f3 }
#slickWrap .slider-cont .txt .his .tt {font-size:2.0rem; font-family:'OneStoreMobileGothicTitleFont';}
#slickWrap .slider-cont .txt .his #dotList li + li {margin-top:0.5em}
#slickWrap .slider-cont .txt #mBtn {margin-top:0.5em}

#slickWrap .slider-nav {margin-left:30px; width:990px;  position:relative; z-index:1;}
#slickWrap .slider-nav .img {margin-right:30px; }
#slickWrap .slider-nav div img {width:100%; max-width:450px; }

#mDoctor #mTitle button.slick-arrow {position:absolute; width:60px; height:60px; bottom:0; border-radius:100%; 
												background:#FFF; z-index:5; cursor:pointer; font-size:0; transition:all 0.3s ease}
#mDoctor #mTitle button.slick-arrow:hover {background:#21418e; border-color:#21418e}
#mDoctor #mTitle button.slick-arrow:before {content:''; width:10px; height:10px; position:absolute; left:50%; top:50%;
											border-top:2px solid #222; border-left:2px solid #222; transition:all 0.3s ease}
#mDoctor #mTitle button.slick-arrow:hover:before {border-color:#FFF}
#mDoctor #mTitle button.slick-prev {right:65px}
#mDoctor #mTitle button.slick-prev:before {transform:translate(-35%, -50%) rotate(-45deg)}
#mDoctor #mTitle button.slick-next {right:0}
#mDoctor #mTitle button.slick-next:before {transform:translate(-65%, -50%) rotate(135deg)}


@media all and (max-width:1400px){
	#slickWrap .slider-cont {width:1030px; }
	#slickWrap .slider-cont .img {width:400px}
	#slickWrap .slider-cont .txt { width:calc(100% - 400px); padding:0  70px}
	#slickWrap .slider-nav {margin-left:20px; width:860px; }
	#slickWrap .slider-nav .img {margin-right:20px }
	#slickWrap .slider-nav div img { max-width:400px; }
}
@media all and (max-width:1280px){
	#slickWrap .slider-cont {width:1000px; }
	#slickWrap .slider-cont .txt {padding:0 50px 0 70px}
}
@media all and (max-width:1024px){
	#slickWrap {flex-wrap:wrap}
	#slickWrap .slider-cont {width:100%; }
	#slickWrap .slider-cont .img {width:calc(100% - 540px); padding:30px}
	#slickWrap .slider-cont .txt { width:540px; padding:30px; padding-top:50px} 
	#slickWrap .slider-nav {margin:20px 0 0 0; width:calc(100% + 10px)}
	#slickWrap .slider-nav .img {margin-right:10px }
}
@media all and (max-width:976px){
	#slickWrap .slider-cont .cont {flex-wrap:wrap}
	#slickWrap .slider-cont .img {width:100%; max-width:540px; padding:20px; margin:0 auto}
	#slickWrap .slider-cont .txt { width:100%; padding:30px; padding-top:0} 
	#slickWrap .slider-cont .txt h3:before {display:none }
	#slickWrap .slider-cont .txt h3 br {display:none}
	#mDoctor #mTitle {padding-bottom: 80px}
	#mDoctor #mTitle button.slick-arrow { width:50px; height:50px;}
	#mDoctor #mTitle button.slick-prev {right:55px}
}
@media all and (max-width:480px){
	#slickWrap .slider-cont .txt h3 {font-size:2.4rem; }
	#slickWrap .slider-cont .txt dl {flex-wrap:wrap}
	#slickWrap .slider-cont .txt dl dt {font-size:3.0rem; width:100% }
	#slickWrap .slider-cont .txt dl dd {font-size:1.6rem; margin-top:0.5em}
	#slickWrap .slider-cont .txt .his {flex-wrap:wrap; gap:20px 0; }
	#slickWrap .slider-cont .txt .his .tt {width:100%}
	#mDoctor #mTitle {position:relative; padding-bottom:10vw}
	#mDoctor #mTitle button.slick-arrow { width:10vw; height:10vw;}

	#mDoctor #mTitle button.slick-prev {left:50%; right:auto; transform:translateX(-11vw)}
	#mDoctor #mTitle button.slick-next {left:50%; right:auto; transform:translateX(1vw)}
}



#mNews {overflow:hidden}
#mNews .titleWrap {display:flex; justify-content:space-between; align-items:flex-end; gap:30px}
#mNews .newsArrow {display:flex; gap:5px; flex-shrink:0}
#mNews .newsArrow button {width:58px; height:58px; border-radius:100%; border:1px solid #DDD; background:#FFF; 
									position:relative; font-size:0; cursor:pointer; transition:all 0.3s ease}
#mNews .newsArrow button:hover {background:#21418e; border-color:#21418e}
#mNews .newsArrow button:before {content:''; width:10px; height:10px; position:absolute; left:50%; top:50%; 
											border-top:2px solid #222; border-left:2px solid #222; transition:all 0.3s ease}
#mNews .newsArrow button:hover:before {border-color:#FFF}
#mNews .newsArrow .newsPrev:before {transform:translate(-35%, -50%) rotate(-45deg)}
#mNews .newsArrow .newsNext:before {transform:translate(-65%, -50%) rotate(135deg)}

#newSlick {margin-top:60px}
#newSlick .slick-list {margin:0 -15px}
#newSlick .slick-slide {margin:0 15px}
#newSlick .box a {padding:40px; border-radius:10px; background:#f6f9fd; transition:all 0.3s ease;
						display:block; width:100%; height:100%}
#newSlick .box a .blog {display:inline-block; padding:0.5em 1em; background:#FFF; border-radius:5px; color:#21418e;
							font-size:1.4rem; font-weight:700; font-family:'Montserrat'; text-transform:uppercase}
#newSlick .box a h3 {margin-top:1.5em; font-size:2.4rem; font-weight:700; color:#333; transition:all 0.3s ease;
						line-height:1.4em; height:2.8em; overflow: hidden; text-overflow: ellipsis; 
						display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}
#newSlick .box a .t1 {font-size:1.7rem; margin-top:1em;  transition:all 0.3s ease;
						line-height:1.6em; height:4.8em; overflow: hidden; text-overflow: ellipsis; 
						display: -webkit-box; -webkit-line-clamp: 3;  -webkit-box-orient: vertical;}
#newSlick .box a ul {margin-top:1.3em; padding-top:1.3em; border-top:1px solid rgba(85,85,85,0.1); 
						display:flex; justify-content:space-between; font-family:'OneStoreMobileGothicTitleFont'}
#newSlick .box a ul .dd {font-size:2.4rem; color:#333; transition:all 0.3s ease}
#newSlick .box a ul .yymm {font-size:1.6rem; color:#a0a1a2;}

#newSlick .box a:hover {background:#21418e}
#newSlick .box a:hover .blog {background:#FFF}
#newSlick .box a:hover h3 {color:#FFF}
#newSlick .box a:hover .t1 {color:#FFF; opacity:.7}
#newSlick .box a:hover ul { border-color:#47619e;} 
#newSlick .box a:hover ul .dd {color:#FFF}
#newSlick .box a:hover ul .yymm { color:#a6b3d2;}


@media all and (max-width:1280px){
	#newSlick .slick-list {margin:0 -10px}
	#newSlick .slick-slide {margin:0 10px}
	#newSlick .box a {padding:30px}
}
@media all and (max-width:1024px){
	#newSlick {width:130%}
}
@media all and (max-width:976px){
	#newSlick {margin-top:50px}
	#mNews .titleWrap {flex-wrap:wrap}
	#mNews .titleWrap #mTitle {width:100%}
	#mNews .newsArrow {margin:0 auto}
	#mNews .newsArrow button {width:50px; height:50px}
}
@media all and (max-width:480px){
	#newSlick {width:100%; margin-top:10vw}
	#mNews .newsArrow button {width:10vw; height:10vw}
	#newSlick .box a h3 {margin-top:1.0em; font-size:2.2rem;}
	#newSlick .box a .t1 {font-size:1.6rem;}
	#newSlick .box a ul .dd {font-size:2.2rem; }
	#newSlick .box a ul .yymm {font-size:1.5rem; }
}




#mMapTitle {margin-bottom:50px; display:flex;  justify-content:space-between; flex-wrap:wrap; align-items: end;
				gap:30px 0}
#mMapTitle #mTitle h3 .fc {color:#a6b0b7}
#mMapTitle .subway {margin-top:1em; font-size:1.9rem; display:flex; flex-wrap:wrap; gap:5px 30px}
#mMapTitle .subway span {font-size:1.7rem; display:inline-block; padding:0.4em 0.7em; border-radius:30px; color:#FFF;
								margin-right:0.3em}
#mMapTitle .subway span.bg1 {background:#e89c17}
#mMapTitle .subway span.bg2 {background:#3d9e09}
#mMapTitle .maplink {display:flex; gap:10px}
#mMapTitle .maplink a {font-size:2.0rem; color:#333; padding:1.3em; border-radius:5px; box-shadow:0 0 10px rgba(0,0,0,0.07); 
								display:block; font-weight:600}
#mMapTitle .maplink a span {background:no-repeat left center / auto 100%; padding:2px 0}
#mMapTitle .maplink a.icon1 span {background-image:url('/images/main/mmap-icon1.png'); padding-left:36px}
#mMapTitle .maplink a.icon2 span {background-image:url('/images/main/mmap-icon2.png'); padding-left:30px}
#mMapTitle .maplink a:hover {background:#21418e; color:#FFF}

@media all and (max-width:1280px){
	#mMapTitle .maplink a {font-size:1.9rem; padding:1.3em 1.0em;} 
}
@media all and (max-width:680px){
	#mMapTitle #mTitle h3 {line-height:1.2em}
	#mMapTitle #mTitle h3 .fc {font-size:0.7em; display:block}
}
@media all and (max-width:480px){
	#mMapTitle .maplink a {font-size:1.8rem; padding:1.0em 0.8em;} 
	#mMapTitle .maplink a span {padding:0}
	#mMapTitle .maplink a.icon1 span {padding-left:8vw}
	#mMapTitle .maplink a.icon2 span {padding-left:6vw}
}




#mMapCont {display:flex; gap:10px}
#mMapCont #mMap {width:calc(100% - 420px); border-radius:10px; overflow:hidden}
#mMapCont #mMap .root_daum_roughmap .wrap_map { height: 510px; border-bottom:1px solid #DDD }
#mMapCont #cont {width:420px; padding:0 40px; border-radius:10px; background:#21418e; color:#FFF;
						display:flex; flex-direction: column;  justify-content:center;}
#mMapCont #cont h3 {margin-bottom:0.6em; font-size:2.4rem; font-family:'OneStoreMobileGothicTitleFont'; font-weight:normal}
#mMapCont #cont i {font-size:1.8rem; margin-right:0.3em}
#mMapCont #cont .hour {font-size:2.0rem; width:340px; display:flex; flex-wrap:wrap }
#mMapCont #cont .hour li.dd {width:110px;}
#mMapCont #cont .hour li.tt {width:calc(100% - 110px); font-family:'Roboto'; font-weight:300}
#mMapCont #cont .hour li.tt.t2 {font-size:'SUIT'; font-weight:400}
#mMapCont #cont .hour li.tt.t2 .point {color:#f2e514; font-weight:500}
#mMapCont #cont .hour li {margin-top:0.3em}
#mMapCont #cont .tel {font-size:2.8rem; color:#31edef;font-family:'OneStoreMobileGothicTitleFont'; font-weight:normal }
#mMapCont #cont .t1 {font-size:2.0rem;}
#mMapCont #cont .line {border-top:1px solid #38549a; margin:1.3em 0}

@media all and (max-width:1600px){
	#mMapCont #mMap {width:calc(100% - 380px); }
	#mMapCont #cont {width:380px; padding:0 40px;}
	#mMapCont #cont .hour {width:300px;}
}
@media all and (max-width:1280px){
	#mMapCont #mMap .root_daum_roughmap .wrap_map { height:480px; }
	#mMapCont #cont .hour li.dd {width:100px;}
	#mMapCont #cont .hour li.tt {width:calc(100% - 100px);} 
}
@media all and (max-width:1024px){
	#mMapCont #mMap .root_daum_roughmap .wrap_map { height:440px; }
	#mMapCont #mMap {width:calc(100% - 340px); }
	#mMapCont #cont {width:340px; padding:0 40px;}
	#mMapCont #cont .hour {font-size:1.8rem; width:260px} 
	#mMapCont #cont .hour li.dd {width:90px;}
	#mMapCont #cont .hour li.tt {width:calc(100% - 90px);} 
	#mMapCont #cont .tel {font-size:2.6rem;} 
	#mMapCont #cont .t1 {font-size:1.8rem;}
}
@media all and (max-width:976px){
	#mMapCont {flex-wrap:wrap}
	#mMapCont #mMap .root_daum_roughmap .wrap_map { height:440px; }
	#mMapCont #mMap {width:100%; }
	#mMapCont #cont {width:100%; padding:40px;}
}
@media all and (max-width:480px){
	#mMapCont {flex-wrap:wrap}
	#mMapCont #mMap .root_daum_roughmap .wrap_map { height:80vw; }
	#mMapCont #cont { padding:8vw;}
	#mMapCont #cont .hour {width:100%}
	#mMapCont #cont .hour li.dd {width:22vw;}
	#mMapCont #cont .hour li.tt {width:calc(100% - 22vw);} 
}