@charset "utf-8";

html { -webkit-text-size-adjust:100%; }
html,body { min-height:100% }
body { min-width:1260px; font:normal 16px 'Montserrat','Noto Sans KR',sans-serif; color:#333; letter-spacing:-0.5px; }
html,body,header,nav,section,footer,div,ol,ul,li,dl,dt,dd,p,h1,h2,h3,h4,h5,h6,a,span,form,input, select { margin:0; padding:0; }
a { border:0; text-decoration:none; font:normal 16px 'Montserrat','Noto Sans KR',sans-serif; letter-spacing:-0.5px; color:#333; }
ul,dl,ol { list-style:none; }
img { max-width:100%; border:0; vertical-align:top; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select: none; }
table { width:100%; border-collapse:collapse; font:normal 16px 'Montserrat','Noto Sans KR',sans-serif; letter-spacing:-0.5px; color:#333; }
table th, table td { border:1px solid #ddd; }
input,select,textarea,button { font:normal 16px 'Montserrat','Noto Sans KR',sans-serif; letter-spacing:-0.5px; color:#333; }

::-moz-selection { color:#fff; background:#002fc8; }
::selection { color:#fff; background:#002fc8; }
::-webkit-input-placeholder {color:#777;}
::-moz-placeholder {color:#777;}
:-ms-input-placeholder {color:#777;}
:-moz-placeholder {color:#777;}
.mobile { display:none; }

#header { width:100%; min-width:1260px; height:80px; border-bottom:1px solid #ddd; position:fixed; left:0; top:0; text-align:center; background:#fff; z-index:10; }
#header h1 { position:absolute; left:40px; top:25px; }
#header h1 a img { height:28px; }
#header ul { padding-top:24px; display:inline-block; overflow:hidden; }
#header ul li { float:left; margin-left:35px; }
#header ul li:first-child { margin-left:0; }
#header ul li a { display:block; padding-top:3px; font-size:17px; font-weight:500; line-height:26px; border-bottom:3px solid #fff; transition:border-color 0.3s; }
#header ul li a:hover { border-color:#002fc8; }
#header > a { position:absolute; right:40px; top:20px; padding:0 18px; -webkit-border-radius:40px; -moz-border-radius:40px; border-radius:40px; font:normal 18px 'Noto Sans KR',sans-serif; font-weight:500; line-height:40px; color:#fff; background:#002fc8; transition:background 0.3s; }
#header > a:hover { background:#222; }
#header > a strong { position:relative; top:1px; font-size:20px; font-weight:600; letter-spacing:0; }
#header #btn_menu { display:none; }

#container { padding-top:81px; }
.title h3 { font-size:40px; font-weight:500; line-height:120%; text-align:center; letter-spacing:-2px; }
.title { margin-bottom:55px; text-align:center; }
.title p { margin-top:16px; font-size:17px; line-height:180%; text-align:center; word-break:keep-all; }

.area_01 #visual { height:700px; overflow:hidden; background:#002fc8; }
.area_01 #visual .left { width:50%; height:100%; float:left; overflow:hidden; position:relative; }
.area_01 #visual .left li { width:100%; height:100%; position:absolute; left:0; top:0; transform:scale(1.1); opacity:0; transition:opacity 1s, transform 6s; }
.area_01 #visual .left li.on { transform:scale(1); opacity:1; }
.area_01 #visual .left li.visual_01 { background:url(../images/visual_01.jpg) right center no-repeat; background-size:cover; }
.area_01 #visual .left li.visual_02 { background:url(../images/visual_02.jpg) right center no-repeat; background-size:cover; }
.area_01 #visual .left li.visual_03 { background:url(../images/visual_03.jpg) right center no-repeat; background-size:cover; }
.area_01 #visual .right { display:table; width:50%; height:100%; float:right; }
.area_01 #visual .right > div { display:table-cell; vertical-align:middle; padding-left:90px; }
.area_01 #visual .right > div h2 { margin-bottom:30px; font-size:46px; font-weight:300; line-height:130%; color:#fff; letter-spacing:-2px; }
.area_01 #visual .right > div h2 span { font-weight:800; }
.area_01 #visual .right > div p { margin-bottom:35px; font-size:18px; line-height:160%; color:#fff; letter-spacing:-1px; word-break:keep-all; }
.area_01 #visual .right > div a { display:block; width:210px; -webkit-border-radius:54px; -moz-border-radius:54px; border-radius:54px; font-size:18px; font-weight:500; line-height:54px; text-align:center; background:#fff; transition:background 0.2s, color 0.2s; }
.area_01 #visual .right > div a:hover { background:#222; color:#fff; }
.area_01 #info { width:1200px; margin:0 auto; padding:80px 0; overflow:hidden; }
.area_01 #info li { width:279px; margin-left:28px; padding:40px 0 38px; float:left; border:1px solid #ccc; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; box-sizing:border-box; text-align:center; cursor:pointer; transition:background 0.3s; }
.area_01 #info li:hover { background:#fafafa; }
.area_01 #info li:first-child { margin-left:0; }
.area_01 #info li p.icon { margin-bottom:22px; }
.area_01 #info li p { font-size:17px; line-height:160%; }

.area_02 { padding:110px 0; background:#f5f5f5; }
.area_02 ul { width:90%; margin:0 auto -40px; overflow:hidden; }
.area_02 ul li { width:23.5%; margin-left:2%; margin-bottom:40px; float:left; text-align:center; }
.area_02 ul li:nth-child(4n+1) { margin-left:0; }
.area_02 ul li p.img { overflow:hidden; background:#002fc8; }
.area_02 ul li p.img img { transition:transform 1s; }
.area_02 ul li p.img:hover img { transform:scale(1.1); }
.area_02 ul li p.txt { margin-top:12px; font-size:18px; }

.area_03 { padding:110px 0; background:#002fc8; }
.area_03 .title { color:#fff; }
.area_03 ul { width:90%; max-width:1200px; margin:0 auto -50px; overflow:hidden; }
.area_03 ul li { width:48%; margin-left:4%; margin-bottom:50px; padding-bottom:50px; -webkit-border-radius:15px; border-radius:15px; box-sizing:border-box; float:left; text-align:center; background:#fff; }
.area_03 ul li:nth-child(2n+1) { margin-left:0; }
.area_03 ul li p { padding:10% 10% 7%; }
.area_03 ul li dl dt { display:block; margin-bottom:30px; font-size:24px; line-height:26px; font-weight:700; }
.area_03 ul li dl dd { display:block; font-size:16px; line-height:180%; color:#555; }
.area_03 ul li dl dd:nth-child(2) { display:inline-block; }
.area_03 ul li dl dd:nth-child(3) { display:inline-block; margin-left:10px; }
.area_03 ul li dl dd strong { font-weight:700; color:#002fc8; }

.area_04 { padding:110px 0; background:#f5f5f5; }
.area_04 .contents {  }
.area_04 ul li { padding:50px; box-sizing:border-box; -webkit-border-radius:15px; border-radius:15px; box-shadow:rgba(0,0,0,0.05) 0 0 20px; background:#fff; opacity:0.5; }
.area_04 ul li.swiper-slide-active { opacity:1; }
.area_04 ul li p.txt { line-height:170%; word-break:keep-all; }
.area_04 ul li p.stars { margin-top:16px; }
.area_04 ul li p.stars img { width:24px; margin-right:3px; }
.area_04 ul li p.name { margin-top:20px; letter-spacing:1px; color:#777; }

#footer { padding:60px; text-align:center; background:#333; line-height:180%; color:#fff; letter-spacing:0; }
#footer p:first-child { margin-bottom:20px; }
#footer p em { font-style:normal; font-weight:700; }
#footer p span { color:#a8aaaf; letter-spacing:0; }
#footer p a { color:#ddd; }

#btn_foot_tel { display:none; }

#warning_popup { display:none; justify-content:center; align-items:center; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:100; }
#warning_popup .inner { width:100%; max-width:400px; border-radius:15px; background:#fff; overflow:hidden; }
#warning_popup .inner .head { font-size:26px; font-weight:700; color:#fff; line-height:80px; background:#222; text-align:center; }
#warning_popup .inner .head img { width:30px; margin-top:24px; margin-right:10px; }
#warning_popup .inner .body { padding:10%; font-size:20px; font-weight:300; word-break:keep-all; }
#warning_popup .inner .foot a { display:block; border-top:1px solid #ccc; font-size:20px; font-weight:600; line-height:60px; text-align:center; }


@media screen and (min-width:901px) {
	#header #navi { display:block !important; }
}

@media screen and (max-width:1580px) {
	.area_01 #visual .right > div { padding-left:70px; }
	.area_01 #visual .right > div h2 { font-size:40px; }
	.area_01 #visual .right > div p { font-size:17px; }
}

@media screen and (max-width:900px) {
	.pc { display:none; }
	.mobile { display:initial; }
	body { min-width:300px; }

	#header { min-width:auto; height:56px; border-bottom:1px solid #ddd; }
	#header h1 { left:6%; top:17px; }
	#header h1 a img { height:22px; }
	#header > a { display:none; }

	#header #navi { width:100%; position:absolute; left:0; top:57px; display:none; }
	#header #navi ul { display:block; padding:0; background:#fff; }
	#header #navi ul li { width:100%; margin:0; border-bottom:1px solid #ddd; text-align:center; }
	#header #navi ul li a { padding:0; border:0; font-size:16px; line-height:56px; }
	#header #navi ul li a:hover { background:#002fc8; color:#fff; }
	#header #btn_menu { width:70px; height:56px; display:block; position:absolute; right:0; top:0; background:url(../images/btn_menu.png) center center no-repeat; background-size:22px auto; }
	#header #btn_menu.on { background-image:url(../images/btn_close.png); }

	#container { padding-top:55px; }
	.title { max-width:88%; margin:0 auto 40px; }
	.title h3 { font-size:26px; letter-spacing:-1px; }
	.title p { font-size:15px; line-height:170%; }
	.title p br { display:none; }

	.area_01 #visual { height:auto; position:relative; z-index:5; }
	.area_01 #visual .left { width:100%; height:70vw; }
	.area_01 #visual .right { width:100%; }
	.area_01 #visual .right > div { padding:35px 6% 40px; }
	.area_01 #visual .right > div h2 { margin-bottom:16px; font-size:26px; line-height:150%; letter-spacing:-1px; }
	.area_01 #visual .right > div p { margin-bottom:22px; font-size:15px; line-height:170%; }
	.area_01 #visual .right > div p br { display:none; }
	.area_01 #visual .right > div a { width:100%; font-size:17px; line-height:56px; }
	.area_01 #info { width:88%; padding:50px 0; }
	.area_01 #info ul { margin-top:-4%; }
	.area_01 #info ul li { width:48%; margin-left:0; margin-right:4%; margin-top:4%; padding:28px 0 20px; }
	.area_01 #info ul li:nth-child(2n) { margin-right:0; }
	.area_01 #info ul li p.icon { margin-bottom:15px; }
	.area_01 #info ul li p.icon img { width:46px; }
	.area_01 #info ul li p { font-size:14px; }

	.area_02 { padding:50px 0; } 
	.area_02 ul { width:88%; margin-bottom:-30px; }
	.area_02 ul li { width:100%; margin-left:0; margin-bottom:32px; }
	.area_02 ul li p.txt { margin-top:12px; font-size:18px; }

	.area_03 { padding:50px 0; }
	.area_03 ul { width:88%; margin-bottom:-30px; }
	.area_03 ul li { width:100%; margin-left:0; margin-bottom:30px; padding-bottom:35px; }
	.area_03 ul li dl dt { margin-top:-5px; margin-bottom:16px; font-size:20px; }
	.area_03 ul li dl dd { font-size:15px; }

	.area_04 { padding:50px 0; }
	.area_04 ul li { padding:30px 26px; }
	.area_04 ul li p { font-size:15px; }

	#footer { padding:50px 6% 120px; }
	#footer p { font-size:15px; }
	#footer p a { font-size:15px; }

	#btn_foot_tel { display:block; width:88%; position:fixed; left:6%; bottom:20px; z-index:1; padding:0 0 2px; -webkit-border-radius:40px; border-radius:40px; box-sizing:border-box; box-shadow:rgba(0,0,0,0.7) 0 0 10px; font:normal 20px 'Noto Sans KR',sans-serif; font-weight:500; line-height:54px; text-align:center; color:#fff; background:#002fc8; }
	#btn_foot_tel > strong { font-weight:700; letter-spacing:0; }

	#warning_popup { align-items:flex-end; }
	#warning_popup .inner { border-radius:10px 10px 0 0; }
}