@charset "utf-8";

/* layout */
.inner {	width: 100%; max-width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;  }
.s-inner {	width:100%; max-width:1400px;	position:relative;	margin-left:auto;	margin-right:auto; }
#wrap { /* overflow-x: hidden; */ /*scroll-behavior:smooth;*/ }

br.br1280{display: none;}
br.br980{display: none;}
br.br768{display: none;}
br.br480{display: none;}


.p-Part{padding: 14rem 0;}

/* 타블렛 가로 */
@media all and (max-width:1620px) {
    .inner {	width:94%; }
}
@media all and (max-width:1420px) {
    .s-inner {	width:94%; }
}
@media all and (max-width:1280px) {
    html { font-size: 60% !important; }
    br.br1280{display: block !important;}
    .p-Part{padding: 12rem 0;}
}
@media all and (max-width:980px) {
    html { font-size: 60% !important; }
    br.br980{display: block !important;}
    .p-Part{padding: 10rem 0;}
}
@media all and (max-width:768px) {
    html { font-size: 0.55rem !important; }
    br.br768{display: block !important;}
    .p-Part{padding: 8rem 0;}
}
@media all and (max-width:480px) {
    html { font-size: 2.2vw !important; }
    br.br480{display: block !important;}
}


:root{
    --color1:#0a4595;
    --color2:#1a64c7;
}

#header { position:fixed; width:100%; height:100px;  z-index:150;}
#header .inner{display: flex; align-items: center; justify-content: space-between; height: 100%;}
#header #logo {  z-index:999; font-size:0;}
#header #logo  a {display:block; width:100%; height:100%}
#header #logo img { width:100%  }
#header #logo img.on{ display:none; }
#header .hd_mbx { display: none; }

#header .rcont{display: flex;align-items: center;gap: 3rem;}
#header .sns{z-index: 122;}
#header .sns a{color: #fff; font-size: 2rem; font-weight: 600; width: 18rem; height: 5.5rem; border-radius: 100px; background: var(--color1); display: flex; align-items: center; justify-content: center;}

#gnb_pc { line-height:100px;}
#gnb_pc > ul > li {display:inline-block; vertical-align:top; text-align:center; position:relative; }
#gnb_pc > ul > li > div > a { display:block; font-size:1.8rem; position:relative; width: auto; padding: 0 33px; cursor: pointer; color:#FFF; font-weight:600   }
#gnb_pc > ul > li > div:hover a { color:var(--color1) !important;   }
#gnb_pc > ul > li > ul { display: none; width:180px; background: var(--color1); position: absolute; top: 110px; left: 50%; margin-left: -90px; overflow:hidden }
#gnb_pc > ul > li:nth-child(2) > ul {width:240px; margin-left:-120px }
#gnb_pc > ul > li > ul > li > a { font-size:1.8rem; display:block; width:100%; color:#fff; padding:0.8em 0.7em; line-height: 1.4em;  box-sizing: border-box; }
#gnb_pc > ul > li > ul > li:last-child > a {border-bottom:0;}
#gnb_pc > ul > li > ul > li > a:hover { background: var(--color1); }


#header.scroll { background:#FFF;}
#header.scroll #gnb_pc > ul > li > div > a {color:#222}


#header.scroll #logo img {display:none}
#header.scroll #logo img.on{ display:block; }
#header.scroll .menuToggle span { background:#222; } 


#gnb_mo { position:fixed; top:0; right:0; width:100%; height:100%; max-width:380px; padding: 90px 0; background: rgba(40,40,40, 0.95); overflow-y:scroll; -ms-overflow-style:none; z-index: 100; text-align: left; transition: all 0.4s ease; -webkit-transform: translateX(100%) rotate(0); -moz-transform: translateX(100%) rotate(0); -ms-transform: translateX(100%) rotate(0); -o-transform: translateX(100%) rotate(0); transform: translateX(100%) rotate(0); }
#gnb_mo > ul { border-top: 1px solid rgba(255,255,255,0.1); line-height:3.5em;}
#gnb_mo > ul > li > div {display:block; width:100%; font-size:2.0rem;  border-bottom:1px solid rgba(255,255,255,0.1); box-sizing:border-box; padding:1rem 1.5em; position:relative; cursor: pointer; }

#gnb_mo > ul > li > div > a { color:#fff; display: inline-block; width: 100%; height: 100%;}
#gnb_mo > ul > li > ul { display:none; }
#gnb_mo > ul > li > ul > li > a {display:block; width:100%; font-size:2rem; color:#4b4b4b;padding:0 1.8em; font-weight: 500; border-bottom:1px solid #e1e1e1; background:#fff; box-sizing:border-box; line-height:3.5em;}

#gnb_mo > ul > li > div.on { background: #0f4d94; }
#gnb_mo > ul > li > div.on:before {transform:rotate(90deg)}

#header.mo_on #gnb_mo {display:block;}
#gnb_mo.m_menuOn {	-webkit-transform: translateX(0) rotate(0); -moz-transform: translateX(0) rotate(0);	-ms-transform: translateX(0) rotate(0);	-o-transform: translateX(0) rotate(0);	transform: translateX(0) rotate(0); }


.menuToggle { position: relative; width:80px; height:80px; cursor:pointer; z-index:101; }
.menuToggle span { display:block; width:30px; height:3px; border-radius:3px; background:#FFF; position:absolute; top: 50%; left:50%; margin-left: -16px; transition:all 0.5s}
.menuToggle span.t { margin-top: -11px; }
.menuToggle span.m { margin-top:-1px; width: 20px; }
.menuToggle span.b { margin-top: 9px; }

.menuToggle.m_on span { background: #fff !important; }
.menuToggle.m_on span.t { transform:rotate(45deg); margin-top: 0;  }
.menuToggle.m_on span.m {width:0;}
.menuToggle.m_on span.b { transform:rotate(-45deg); margin-top: 0; }



@media all and (max-width:1280px) {
    #header {height:80px;}
    #header #logo{width: 22rem;}
    #gnb_pc { line-height:80px;}
    #gnb_pc > ul > li > div > a{font-size: 1.6rem;padding: 0 25px;}
    #header .sns a{font-size: 1.6rem;width: 14rem; height: 5rem;}
}
@media all and (max-width:980px) {
    #header {padding:0; border-bottom: 1px solid rgba(255,255,255,0.1); }
    #header .inner{width: 100%;}
    #header .hd_mbx { display: block; }
    
    #header #gnb_pc {display:none; }
    #header .rcont{gap: 0.5rem;}
    

    #header #logo{margin-left: 2%;}
    #header #logo img { vertical-align:middle;}

    #gnb_mo { padding: 80px 0; }
}
@media all and (max-width:768px) {
    #header { height:70px; }
    #header #logo {margin-left:3%}
    .menuToggle { width: 70px; height: 70px; }
    #gnb_mo { padding: 70px 0; }
    #header .sns a{font-size: 1.6rem;width: 100%; height: 4.5rem; padding: 0 2rem;}
}
@media all and (max-width:480px) {
    #header { height:60px; }
    #header #logo { width:18rem;}
    .menuToggle { width: 60px; height:60px; }
    #gnb_mo { padding: 60px 0; }
    #header .sns a{height: 4rem; font-size: 1.5rem;}
}




/* footer */
#footer {background: #000;padding: 8rem 0;}
#footer .top{display: flex; justify-content: space-between;}
#footer .top ul{display: flex;gap: 2rem; flex-wrap: wrap;}
#footer .top ul li a{color: #fff;font-size: 1.6rem;}
#footer .bot{margin-top: 3rem; color: #fff; opacity: 0.7;}
#footer .bot .info{display: flex; gap: 0.7rem 3rem; flex-wrap: wrap;}
#footer .bot .info li{display: flex; align-items: center;gap: 1.5rem; font-size: 1.6rem;}
#footer .bot .info li span{font-weight: bold;}
#footer .bot p{margin-top: 2.5rem; text-align: right;font-size: 1.6rem; display: flex; align-items: center;gap: 0.5rem 4rem; justify-content: end; opacity: 0.3; flex-wrap: wrap;}
#footer .bot p a{color: #fff;}

@media all and (max-width:1280px) {
    #footer {padding: 6rem 0;}
    #footer .top .logo{width: 20rem;}
    #footer .top .logo img{width: 100%;}
    #footer .top ul li a{font-size: 1.5rem;}
}
@media all and (max-width:768px) {
    #footer .top{flex-direction: column;gap: 2rem; align-items: center;}
    #footer .bot .info{justify-content: center;}
    #footer .bot p{justify-content: center;}
}



#fixedConsult{position: fixed; z-index: 9990; bottom: 0; left: 0; width: 100%; padding: 2rem 0; background: rgba(6,39,87,0.97); box-shadow: 0 -5px 30px rgba(0,0,0,0.15); transition: transform 0.4s ease;}
#fixedConsult .inner{display: flex; align-items: center; justify-content: space-between; gap: 3rem; width: calc(100% - 4rem); max-width: 1600px; margin: 0 auto;}
#fixedConsult .fixed_txt{flex-shrink: 0; color: #fff;width: 27rem;}
#fixedConsult .fixed_txt strong{display: block; font-size: 2.6rem; font-weight: 700; margin-bottom: 0.5rem;}
#fixedConsult .fixed_txt p{font-size: 1.5rem; color: rgba(255,255,255,0.7);}
#fixedConsult form{flex: 1; min-width: 0;}
#fixedConsult .fixed_form{display: flex; align-items: center; gap: 1rem; width: 100%;}
#fixedConsult .input_box{display: flex; align-items: center; flex: 1; min-width: 0; height: 5.5rem; padding: 0 1.5rem; background: #fff; border-radius: 0.5rem;}
#fixedConsult .input_box label{flex-shrink: 0; margin-right: 1rem; font-size: 1.6rem; font-weight: 700; color: #222;}
#fixedConsult .input_box input{width: 100%; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; font-family: inherit; font-size: 1.5rem; color: #222;}
#fixedConsult .input_box input::placeholder{color: #aaa;}
#fixedConsult .fixed_agree{display: flex; justify-content: center; align-items: flex-start; flex-shrink: 0; gap: 0.5rem; margin: 0 10rem 0 1rem;}
#fixedConsult .fixed_agree label{display: flex; align-items: center; gap: 0.5rem; cursor: pointer;}
#fixedConsult .fixed_agree input{width: 1.6rem; height: 1.6rem; margin: 0; accent-color: #0a4595;}
#fixedConsult .fixed_agree span{font-size: 1.4rem; color: #fff; white-space: nowrap;}
#fixedConsult .privacy_open{padding: 0; border: 0; background: transparent; color: rgba(255,255,255,0.7); font-size: 1.3rem; text-decoration: underline; cursor: pointer;}
#fixedConsult .submit_btn{display: flex; align-items: center; justify-content: center; flex-shrink: 0; gap: 1rem; height: 5.5rem; padding: 0 3rem; border: 0; border-radius: 0.5rem; background: #fff; color: #0a4595; font-size: 1.8rem; font-weight: 700; white-space: nowrap; cursor: pointer; transition: 0.3s;}
#fixedConsult .submit_btn:hover{background: #dbe9fc;}
#fixedConsult .submit_btn span{font-size: 2rem;}
#fixedConsult.hide{transform: translateY(110%);}

@media all and (max-width:1280px){
    #fixedConsult .inner{gap: 2rem;}
    #fixedConsult .fixed_txt strong{font-size: 2.2rem;}
    #fixedConsult .fixed_txt p{display: none;}
    #fixedConsult .input_box{padding: 0 1rem;}
    #fixedConsult .input_box label{font-size: 1.4rem; margin-right: 0.5rem;}
    #fixedConsult .input_box input{font-size: 1.4rem;}
    #fixedConsult .submit_btn{padding: 0 2rem; font-size: 1.6rem;}
}

@media all and (max-width:980px){
    #fixedConsult{padding: 1.5rem 0;}
    #fixedConsult .inner{flex-direction: column; align-items: stretch; gap: 1.5rem;}
    #fixedConsult .fixed_txt strong{font-size: 2rem;}
    #fixedConsult .fixed_form{flex-wrap: wrap;}
    #fixedConsult .input_box{flex: 1 1 calc(33.333% - 1rem);}
    #fixedConsult .fixed_agree{flex-direction: row; align-items: center; gap: 1rem;}
    #fixedConsult .submit_btn{margin-left: auto;}
}

@media all and (max-width:768px){
    #fixedConsult .inner{gap: 1rem;}
    #fixedConsult .fixed_form{gap: 0.8rem;}
    #fixedConsult .input_box{height: 4.5rem;}
    #fixedConsult .input_box label{display: none;}
    #fixedConsult .input_box input{font-size: 1.5rem;}
    #fixedConsult .submit_btn{height: 4.5rem;}
}

@media all and (max-width:480px){
    #fixedConsult{padding: 1.2rem 0;}
    #fixedConsult .inner{width: calc(100% - 3rem);}
    #fixedConsult .fixed_txt strong{font-size: 1.8rem;}
    #fixedConsult .input_box{flex: 1 1 calc(50% - 0.4rem); height: 4.2rem;}
    #fixedConsult .input_box:nth-child(3){flex: 1 1 100%;}
    #fixedConsult .input_box input{font-size: 1.4rem;}
    #fixedConsult .fixed_agree span{font-size: 1.3rem;}
    #fixedConsult .privacy_open{font-size: 1.2rem;}
    #fixedConsult .submit_btn{height: 4rem; padding: 0 1.5rem; font-size: 1.5rem;}
    #fixedConsult .submit_btn span{font-size: 1.8rem;}
}
