@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.6/dist/web/static/pretendard.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@300..900&display=swap');
@import url(css/gonggothic.css);
@import url(https://cdn.jsdelivr.net/xeicon/1/xeicon.min.css);
@import url(https://cdn.jsdelivr.net/xeicon/2/xeicon.min.css);
@import url(css/blank.css);

*{margin:0; padding:0; box-sizing:border-box;letter-spacing:-0.05em;color:inherit;}
html {font-size: 20px;}
img {border:0; vertical-align:top;}
a {border:0; text-decoration:none; -webkit-transition:all 0.2s ease-out; transition:all 0.2s ease-out;}
ul, li {list-style:none;}
html {overflow-y:scroll;height:100%;min-width:320px}
body {height:100%; font-family: "Pretendard Variable", Pretendard, sans-serif; color:#303030;}
div {display:block;}



.inner {width:30rem;margin:auto;clear:both}
.inner2 {width:28rem;margin:auto;clear:both}

.c_default {color:#303030 !important}
.c_lightgray {color:#c8c1b8 !important}
.c_gray {color:#808080 !important}
.c_red {color:#c70000 !important}
.c_white {color:#fff !important}
.color1 {color: #005a65 !important;}



h1,h2,h3 {font-weight:300;line-height:1.3}
h1 {font-size:2.5rem;}
.sizeh1 {font-size: 2.5rem !important;}
h1.small {font-size: 2.2rem;}
h1.big {font-size: 3rem; }
h1.superbig {font-size: 4rem; letter-spacing:-0.02em;}
.h1_giant {font-size: 5rem; letter-spacing:-0.03em;}
h2 {font-size:2rem}
h3 {font-size:1.5rem; }
.sizeh3 {font-size:1.5rem; }
h4 {font-size:1.2rem; font-weight:400; line-height:1.45;}
.sizeh4 {font-size: 1.2rem;}
h5 {font-size:1.1rem; font-weight: 400; line-height:1.6; word-break:keep-all;}
.sizeh5 {font-size: 1.1rem !important;}
p {font-size:0.9rem; line-height:1.7; color:inherit; word-break:keep-all; }
.size_p {font-size:0.9rem !important;}
p.small {font-size:0.81rem; }
p.typeline {font-size:0.63rem; }
sub {font-size: small; }
.small {font-size: 0.65rem;}



.gonggothic {font-family: 'GongGothicBold';}
.loose {letter-spacing: 0.4rem;}
.loose2 {letter-spacing: 0.2rem;}
b {letter-spacing: inherit; font-weight: 600;}
.bold {font-weight: 700 !important;}
.black {font-weight: 800 !important;}


span {color:inherit;}

.float {float:left;}
.float_r {float:right}
.left {text-align:left !important}
.right {text-align:right !important}
.center {text-align:center !important}
.clearfix::after {content:""; clear:both; display: block;}
.inlineblock {display: inline-block;}

.relative {position: relative;}


.flex {display: flex;}
.col1 {flex: 1;}
.col2 {flex: 2;}
.col3 {flex: 3;}
.col4 {flex: 4;}
.col5 {flex: 5;}
.col6 {flex: 6;}


.bd_b {border-bottom:1px #e0e0e0 solid}
.bd_t {border-top:1px #e0e0e0 solid}



/* 컬럼 설정 */
.w05 {width: 5%;}
.w10 {width: 10%;}
.w15 {width: 15%;}
.w20 {width: 20%;}
.w22 {width: 22%;}
.w25 {width: 25%;}
.w30 {width: 30%;}
.w40 {width: 40%;}
.w50 {width: 50% !important;}
.w60 {width: 60%;}
.w75 {width: 75%;}
.w80 {width: 80%;}
.w85 {width: 85%;}
.w90 {width: 90%;}
.w100 {width: 100% !important;}







/* 공통 */
#wrap {width:640px; margin:auto; position:relative; }

.pc_show {
  display: none !important;
}


#header {width:640px; height: 10.5rem; position: fixed; top: 0; z-index: 100; background-color: rgba(0, 0, 0, 0.8); -webkit-transition:all 0.2s ease-in; transition:all 0.2s ease-in;}
#header h1.logo {position: absolute; top: 1.5rem; left: 1rem;  width: 8.15rem; height: 2.8rem; background: url(images/logo.png) no-repeat; background-size: contain; text-indent: -3333px;}
#header h1.logo a {display: block;}
#header a.tel {width: 11.5rem; height: 5rem; position: absolute; top: 0; right: 0; background: url(images/tel.png) no-repeat; background-size: 100%; display: block; text-indent: -3333px;}
#header #gnb { margin-top: 5.5rem; padding: 0 1rem;}
#header #gnb li {float: left; width: calc(100%/4); font-size: 1.1rem; line-height: 2.1; color: #dca24c; font-weight: 700; text-align: center;} 
#header #gnb li.bottom {width: calc(100%/3);}

#header.jbFixed {background-color: rgba(0, 0, 0, 0.8);}




#visual {width: 100%; height: 34.5rem; background: url(images/mo/visual.jpg) top center no-repeat; background-size: cover;}


.scroll_bg {width: 100%; background-color: #f0f0f0; padding-top: 0.75rem;}
.scroll-downs {
  position: relative;
  right: 0;
  left: 0;
  margin: auto;
  z-index: 1;
  width :1.7rem;
  height: 2.75rem;
}
.mousey {
  width: 0.15rem;
  padding: 0.5rem 0.75rem;
  height: 1.75rem;
  border: 0.1rem solid #005a65;
  border-radius: 1.25rem;
  opacity: 0.75;
  box-sizing: content-box;
}
.scroller {
  width: 0.15rem;
  height: 0.5rem;
  border-radius: 25%;
  background-color: #005a65;
  animation-name: scroll;
  animation-duration: 2.2s;
  animation-timing-function: cubic-bezier(.15,.41,.69,.94);
  animation-iteration-count: infinite;
}
.scroll-downs p.typeline {font-size: 0.5rem; line-height: 1.3; margin-top: 0.25rem;}
@keyframes scroll {
  0% { opacity: 0; }
  10% { transform: translateY(0); opacity: 1; }
  100% { transform: translateY(0.75rem); opacity: 0;}
}



#menu {width: 100%; padding: 0.8rem 0.5rem; background-color: #005a65; z-index: 1; font-size: 1.15rem;}
#menu ul {display: flex;}
#menu ul li {flex: 1; text-align: center; margin: 0 0;}
#menu ul li a {display: block; line-height: 2.2rem; border-radius: 2rem; color: #fff; }
#menu ul li a.on,#menu ul li a:hover {background-color: #96eade; color: #303030; font-weight: 700; font-size: 1.2rem;}



/* 서브페이지 탭 */
#wrap #content {background-color: #f0f0f0; width: 100%; height: auto; display: inline-block; padding: 0rem 0 3rem;}
#wrap #content .inner {}

#wrap #content .tabbox {width:100%; margin-bottom: 2rem; display: inline-block; text-align: center;}
#wrap #content .tabbox h2,#wrap #content .tabbox h3 {width:100%; font-size: 2rem !important; display: inline-block; margin-bottom: 0; padding-bottom: 0.5rem;}
#wrap #content ul.tabs {width:100%;line-height:3rem; display: flex; border-top: 0; }
#wrap #content ul.tabs li {border-bottom: 1px #d0d0d0 solid; border-top: 2px #808080 solid; flex:1;}
#wrap #content ul.tabs.plus li {border-top: 0 !important;}
#wrap #content ul.tabs li a {display:block; padding: 0 0.5rem; font-weight: 700; -webkit-transition:all 0.2s ease-out;transition:all 0.2s ease-out;}
#wrap #content ul.tabs li:hover a {background-color: #005a65; color: #fff;}
#wrap #content ul.tabs li.active a,
#wrap #content ul.tabs li a.on {background-color: #005a65; color: #fff;}
#wrap #content ul.tabs li span.small {line-height: 0;}

#wrap #content .tab_container {width:100%;  display: inline-block; }
#wrap #content .tab_content {width:100%; display: inline-block; border-radius: 2rem; background: url(images/mo/report_caption.png) right top no-repeat #fff; background-size: auto 4.55rem; min-height: 10rem; padding: 0.5rem 1.5rem 3rem;}
#wrap #content .tab_content.intab {margin-top: 3rem;}
#wrap #content .tab_content .bookmark { width: 100%; display: inline-block; height: 2.8rem;}
#wrap #content .tab_content .bookmark h3 {float: left; margin-top: 1rem; margin-bottom: 0.5rem; margin-right: 3rem;}
#wrap #content .tab_content .bookmark h3::after {content: ""; clear: both;}
#wrap #content .tab_content .bookmark h4 {float: left; }
#wrap #content .tab_content .title {padding-top: 4rem;}

#wrap #content .tab_content .paragraph {width: 100%; display: inline-block;}
#wrap #content .tab_content .preface { padding: 2rem;  border: 2px #303030 solid; background-color: #b7f5ec; margin-top: 2rem;}
#wrap #content .tab_content .paragraph.m_show img {width: 100%;}

#wrap #content .tab_content .bullet {margin-left: 0.7rem;}
#wrap #content .tab_content .bullet::before {content: "\00B7"; margin-right: 0.5rem; margin-left: -0.7rem;}


.idTabs {display: flex; width: 100%;  text-align: center; position: relative; margin-top: -3.75rem; margin-bottom: 1rem; }
.idTabs.double {margin-top: -5rem; margin-bottom: 1rem;}
.idTabs li {flex: 1; padding: 0 0.1rem;}
.idTabs li a {padding: 0.6rem 0; display: block; border: 2px #d0d0d0 solid; background-color: #fff; border-radius: 50px; font-family: 'GongGothicBold'; color: #a0a0a0;}
.idTabs li a.selected {border: 2px #303030 solid; background-color: #96eade; font-weight: 700; color: #303030;}




#formbox {background-color: #005a65; padding: 5rem 0;}
#formbox .inner { background-color: #fff; border: 3px #303030 solid; box-shadow: 0.25rem 0.25rem 0 #000; padding: 2rem 0; position: relative;}
/*
#formbox .inner .form_title {width: 30%; float: left;  }
#formbox .inner .form_write {width: 70%; float: left;  }
*/
#formbox .inner .row {width: 100%; display: inline-block; margin: 0.4rem 0; padding: 0 2.5rem;}
#formbox .inner .part .row h5 {font-weight: 600; margin-bottom: 0.2rem; font-size: 1.4rem;}
#formbox .inner .part .row ul {font-size: 1rem;}
#formbox .inner .part .row ul li {margin-bottom: 0.6rem; margin-left: -1rem; padding-left: 2.2rem; font-size: 1.2rem;}
#formbox .inner .part .row ul input {position: relative; top: 0.15rem; margin-left: -1.2rem; }

#formbox .inner h5 {}
#formbox .inner input {width: 100%; height: 2.25rem; border-radius: 0.25rem; border: 1px #d0d0d0 solid; padding: 0.5rem; font-size: 1.2rem; font-family: inherit; }
#formbox .inner input[name='phone_no1'],
#formbox .inner input[name='phone_no2'],
#formbox .inner input[name='phone_no3'] {width: 30%;}
input[type='radio'],input[type='checkbox'] {width: 1rem !important; height: 1rem !important; }
#formbox .inner textarea {width: 100%; height: 10rem;border-radius: 0.25rem; border: 1px #d0d0d0 solid; padding: 0.5rem; font-size: 1.2rem; font-family: inherit;}


#privacy {position:absolute; bottom:1rem; right:1rem; width:28rem; height:10rem; background-color: #404040; color: #fff; z-index:1; display:none; overflow-y: scroll; border-radius: 10px; padding: 0.5em 1em; box-shadow: 0px 0px 10px rgba(0,0,0,0.2); text-align: justify;}
#privacy::-webkit-scrollbar {
    width: 20px;
  }
#privacy::-webkit-scrollbar-thumb {
    background-color: #202020;
    border-radius: 20px;
    background-clip: padding-box;
    border: 5px solid transparent;
  }
#privacy::-webkit-scrollbar-track {
    background-color: transparent;
  }
#privacy btn.close {position: absolute; top: 10px; right: 0px; background-color:#005a65; color:#fff; width:50px; height:50px; line-height:50px; text-align:center;}
#privacy p {color: #fff !important;}




#footer {width:100%; background-color: #000; color: #fff; padding: 2rem 0; text-align: center; display: inline-block; position: relative;}
#footer .inner {}

#quick {position: fixed; bottom: 0; right: 0; z-index: 1; width: 100%; display: flex;}
#quick a { text-align: center; display: block; height: 3.5rem; line-height: 3.5rem; flex: 1; font-size: 1.5rem;}
#quick #go-home {background-color: #fff; border: 1px #e0e0e0 solid; border-right: 0; color: #005a65;}

#quick #back-top {background-color: #303030; color: #fff;}



@media only screen and (max-width:640px) {
  html {font-size: 3.125vw;}
  #wrap {width:100%;}	   
  #header {width: 100%;}

  img.form_ok {zoom: 0.68;}
}