@charset "UTF-8";
@import url('font.css');
@import url('default.css');


/* 1: Base Setting
=========================================================================================== */
.hidden {display:none;}
.blind {visibility:hidden;}


.cursor {cursor:pointer;}
.non-cursor {cursor:default;}

.ta-r {text-align:right !important;}
.ta-l {text-align:left !important;}
.ta-c {text-align:center !important;}

.va-t {vertical-align:top !important;}
.va-m {vertical-align:middle !important;}
.va-b {vertical-align:bottom !important;}

.clearfix {}
.clearfix:after {content:""; clear:both; display:table; height: 0;}
.fl-l {float:left;}
.fl-r {float:right;}


.blind {display:none;}
.clear {clear:both; height:0;}


.d-b {display: block;}
.d-ib {display: inline-block;}



iframe[name='google_conversion_frame'] {border:0; width:0; height:0; padding:0; margin:0; position:absolute; z-index:-1; visibility:hidden;}

.t-dot-solo {overflow:hidden; white-space:nowrap; text-overflow: ellipsis;}


 /* 2: Common Setting
=========================================================================================== */
html {width:100%; font-size:62.5%;}
body {
	width:100%; font-family:'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', sans-serif; 
	color:#282828; background-color: #f2f2f2; font-weight: normal; font-size:16px; line-height:1.5; -webkit-text-size-adjust: 100%; 
}
#wrap {overflow:hidden; word-break:keep-all; word-wrap:break-word; max-width:960px; margin: 0 auto; font-size: 24px; min-height: 800px;}



#header {display: flex; justify-content: space-between; padding-top: 48px; padding-bottom: 36px; font-size: 20px; font-weight: 700;}
#header .logo {font-weight: 900; font-size: 80px; color: #282828; line-height: 1;}
#header .rgh {text-align: right;}
#header .rgh .t2 {opacity: .5;}





 /* 3: Contents
=========================================================================================== */
.box_txt {padding: 12px 18px 12px 12px; border-radius: 16px; font-size: 32px; font-weight: 700; line-height: 1; color: #fff;}
.box_txt.ty1 {background-color: #30A0FF;}
.box_txt.ty2 {background-color: #282828;}

.box_txt a {display: block; padding-right: 20px; background-image: url('../images/arrow.svg'); background-repeat: no-repeat; background-position: right center; background-size: 10px auto;}


.i_notice {position: relative; display: block; padding-left: 36px;}
.i_notice:after {content:""; position: absolute; left: 0; top: 50%; margin-top: -14px; width: 28px; height: 28px; background-image: url('../images/ico_notice.svg'); background-size: cover;}
.i_won {position: relative; display: block; padding-left: 36px;}
.i_won:after {content:""; position: absolute; left: 0; top: 50%; margin-top: -14px; width: 28px; height: 28px; background-image: url('../images/ico_won.svg'); background-size: cover;}


.box_ad {
	position: relative; padding: 27px 32px; margin-bottom: 12px; margin-top: 12px; border-radius: 16px; font-weight: 800; font-size: 44px; line-height: 1.2;
	background-color: #fff; background-image: url('../images/ad_bg.png'); background-repeat: no-repeat; background-position: right 0; background-size: auto 100%;
}
.box_ad:after {
	content:""; position: absolute; right: 24px; bottom: 0; width: 174px; height: 181px;
	background-image: url('../images/ad_img.svg'); background-repeat: no-repeat; background-position: center center; background-size: cover;
}
.box_ad span {display: block; color: #30A0FF; }
.box_ad p {position: relative; z-index: 1;}



.menu {padding: 24px 0;}
.menu ul {display: flex; flex-wrap:wrap; width: 102%;}
.menu li {width: 31.33%; margin-right: 2%; margin-bottom: 2%; height: auto; background-color: rgba(255,255,255,.3); border-radius: 16px;}
.menu a {display: flex; align-items:center; justify-content: center; padding-top: 20px;   padding-bottom: 20px; font-weight: 800; font-size: 28px; line-height: 1; text-align: center; background-color: #fff; border-radius: 16px;}
.menu a span {display: inline-block; padding-top: 50px; background-repeat: no-repeat; background-position: center 0; background-size: auto 32px;}

.menu .m1 span {background-image: url('../images/menu01.svg');}
.menu .m2 span {background-image: url('../images/menu02.svg');}
.menu .m3 span {background-image: url('../images/menu03.svg');}
.menu .m4 span {background-image: url('../images/menu04.svg');}
.menu .m5 span {background-image: url('../images/menu05.svg');}
.menu .m6 span {background-image: url('../images/menu06.svg');}


/*서브*/
.sub_menu {margin-bottom: 30px;}
.sub_menu ul {font-size: 0;}
.sub_menu li {display: inline-block; vertical-align: top; margin-right: 28px;}
.sub_menu li a {display: block; padding-bottom: 5px; font-size: 24px; font-weight: 700; color: #282828; opacity:.5; border-bottom: 2px solid transparent;}
.sub_menu li.on a {border-bottom-color: #30A0FF; opacity:1;}



.cont {display: flex; padding-bottom: 40px;}


.ad_left {position: relative; width: 30%; margin-right: 24px;}
.ad_left:after {content:""; position: absolute; right: -15px; top: 0; width: 6px; height: 100%; background-color: #000000; border-radius: 3px;}
.ad_left .li {position: relative; display: block; margin-bottom: 12px; border-radius: 16px; background-color: #fff;}
.ad_left .li img {display: block;}
.ad_left .li .bt_more {display: block; width: 100%; line-height: 35px; border-radius: 0 0 16px 16px;}

.ad_left .li {margin-bottom: 24px;}
.ad_left .li > div {overflow:hidden; }
.ad_left .li:after {content:""; position: absolute; left: 0; bottom: -15px; width: 100%; height: 6px; background-color: #000000; border-radius: 3px;}

.ad_left .li:last-child {margin-bottom: 0;}
.ad_left .li:last-child:after {content:none;}

.ad_left .li .view_cont {border-top: 0; padding: 15px; margin-top: 0; font-size: 14px;}
.ad_left .li .view_cont .h2,
.ad_left .li .view_cont .lst li,
.ad_left .li .btn-pk {font-size: 15px;}
.ad_left .li .view_cont .btns .btn-pk {margin-left: 5px; line-height:40px; border-radius: 8px;}
.ad_left .li .view_cont .btns .btn-pk:first-child {margin-left: 0;}


.bt_more {background-color: #30A0FF; color: #fff; padding: 6px 16px; font-size: 20px; font-weight: 700; text-align: center; line-height: 1.5; border-radius: 12px;}
.bt_more span {display: inline-block; padding-right: 15px; color: #fff; background-image: url('../images/arr_link.svg'); background-position: right center; background-repeat: no-repeat; background-size: 6px auto;}


.rgh_con {width: 70%;}
.rgh_con .addr_list {width: 100%;}


.h_tit1 {font-weight: 700; font-size: 20px; color: #535353; margin-bottom: 10px;}


.addr_list {width: 70%;}
.addr_list .li {position: relative; padding: 16px 16px 16px 28px; margin-bottom: 24px; font-weight: 700; font-size: 24px; color: #282828; background-color: #fff; border-radius: 16px;}
.addr_list .li:after {content:""; position: absolute; left: 0; bottom: -15px; width: 100%; height: 6px; background-color: #000000; border-radius: 3px;}
.addr_list .li .t1 {min-height: 72px; opacity:.8;}
.addr_list .li .t2 {overflow:hidden; margin-top: 10px; }
.addr_list .li .i_tel {display: inline-block; color: #30A0FF;}
.addr_list .li .bt_more {float: right;}
.addr_list .ad {display: none;}
.addr_list .ad img {width: 100%;}


.addr_list .li:last-child {margin-bottom: 0;}
.addr_list .li:last-child:after {content:none;}


.i_tel {position: relative; display: block; padding-left: 40px;}
.i_tel:after {content:""; position: absolute; left: 0; top: 50%; margin-top: -14px; width: 28px; height: 28px; background-image: url('../images/ico_tel.svg'); background-size: cover;}



/*.view_cont {padding: 24px; margin-bottom: 30px; background-color: #fff; border-radius: 16px;}*/

.view_cont {padding-top: 20px; margin-top: 20px; border-top: 1px solid #DCDCDC; display: none;}
.view_cont .h1 {padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #DCDCDC; font-weight: 700; font-size: 24px; line-height: 1.2; color: #282828; opacity:.8;}
.view_cont .h2 {margin-bottom: 20px; font-weight: 700; font-size: 20px; line-height: 1; color: #282828;}
.view_cont .lst {list-style-type: none;}
.view_cont .lst li {display: flex; margin-bottom: 10px; font-size: 20px; font-weight: 700; color: #535353; }
.view_cont .lst li .l {margin-right: 5px; color: #a0a0a0;}
.view_cont .btns {display: flex; margin-top: 20px;}
.view_cont .btns .btn-pk {flex:1; margin-left: 20px;}
.view_cont .btns .btn-pk:first-child {margin-left: 0;}

.btn-pk {display: block; line-height: 56px; font-size: 20px; font-weight: 500; color: #646464; text-align: center; border-radius: 16px;}
.btn-pk.gray {background-color: #DCDCDC; color: #646464;}
.btn-pk.blue {background-color: #30A0FF; color: #fff;}
.btn-pk.blue .i_tel {display: inline-block; padding-left: 30px; color: #fff;}

.c-blue {color: #30A0FF;}


 /* 3: Contents - pc외
=========================================================================================== */
@media (max-width:1040px){
	#wrap {padding-left: 40px; padding-right: 40px;}
}

@media (min-width:961px){
	.view-m {display: none;}
}




 /* 4: Mobile
=========================================================================================== */
@media (max-width:961px){

#wrap {padding-left: 20px; padding-right: 20px;}

#header {display: block; padding-top: 30px; padding-bottom: 14px; font-size: 16px;}
#header .logo {font-size: 32px; margin-bottom: 14px;}
#header .rgh {text-align: left;}

.box_txt {font-size: 22px; line-height: 1.3; padding-top: 10px; padding-bottom: 10px;}


.i_notice {padding-left: 28px;}
.i_notice:after {top: 5px; margin-top: 0; width: 20px; height: 20px;}
.i_won {padding-left: 28px;}
.i_won:after {top: 5px; margin-top: 0; width: 20px; height: 20px;}

.box_ad {padding: 16px 20px; margin-bottom: 8px; margin-top: 8px; font-size: 24px; line-height: 1.3; background-image: url('../images/ad_bg_m.png');}
.box_ad:after {right: 0; width: 148px; height: 155px;}
.box_ad span {text-shadow:1px 0 1px rgba(0,0,0,.7);}

.menu {padding: 10px 0;}
.menu li {width: 48%; height: 84px;}
.menu a {height: 84px; font-size: 20px;}
.menu a span {padding-top: 43px; width: 100%; background-size: auto 38px;}


/*서브*/
.sub_menu {overflow-x:auto; margin-bottom: 20px; margin-left: -20px; padding-left: 20px; width: calc(100% + 40px); box-sizing:border-box;}
.sub_menu ul {white-space:nowrap;}
.sub_menu li {margin-right: 20px;}
.sub_menu li a {padding-bottom: 3px; font-size: 20px;}


.ad_left {display: none;}


.addr_list .li {padding: 16px 24px; margin-bottom: 24px; font-size: 24px;}
.addr_list .li:after {content:""; position: absolute; left: 0; bottom: -15px; width: 100%; height: 6px; background-color: #000000; border-radius: 3px;}
.addr_list .li .t1 {/*min-height: 128px;*/}
.addr_list .li .i_tel {/*margin-top: 10px;*/}
.addr_list .ad {display: block; margin-bottom: 8px;}
.addr_list .li .bt_more {float: none; display: block; margin-top: 10px; line-height: 40px;}


.addr_list .ad {display: block; position: relative; margin-bottom: 24px;}
.addr_list .ad:after {content:""; position: absolute; left: 0; bottom: -15px; width: 100%; height: 6px; background-color: #000000; border-radius: 3px;}

.rgh_con {width: 100%;}
.addr_list {width: 100%;}

.view_cont .lst li {font-size: 18px;}
.view_cont .lst li .l {white-space:nowrap;}
.view_cont .btns {display: block;}
.view_cont .btns .btn-pk {margin-left: 0; margin-bottom: 10px;}
.view_cont .btns .btn-pk:last-child {margin-bottom: 0;}

}