.title .content{background: url(../img/topimg.jpg) no-repeat center; background-size: cover; height: 440px;}
.title .txt{text-align: left; width: 100%; max-width: 1170px; margin: 0 auto; padding-top: 200px;}
.title .txt p:first-child{color: #fff; padding-bottom: 20px; font-size: 40px; font-weight: 700;}
.title .txt p:last-child{color: #fff; font-size: 20px; font-weight: 600;}

.info_nav ul{background: #fff; width: 100%; max-width: 1170px; margin: 0 auto; height: 60px; margin-top: -60px; list-style: none;}
.info_nav ul li{float: left; display: flex; justify-content: center; align-items: center; height: 100%; position: relative; width: 25%; font-size: 18px; font-weight: 500; text-align: center; position: relative;}
.info_nav ul li::after{width: 1px; height: 18px; background: #d3d3d3; position: absolute; right: 0; top: 50%; margin-top: -9px; display: block; content: "";}
.info_nav ul li.on p{color:var(--pink); font-weight: bold;}
.info_nav ul li.on p::after{display: block; content: ""; width: 100%; background: var(--pink); bottom: -10px; position: absolute; height: 2px;}
.info_nav ul li p{display: inline-block; font-size: 18px; color: #4d4d4d; font-weight: 500; text-align: center; position: relative; cursor: pointer;}

.about{padding-top: 60px; padding-bottom: 100px;}
.history{padding-top: 60px; padding-bottom: 150px;}
.vision{padding-top: 60px; padding-bottom: 60px;}
.contact{padding-top: 60px; padding-bottom: 150px;}

/* about */
.selTit{text-align: center; padding-bottom: 60px; font-size: 40px; font-weight: 600; font-family: 'Pretendard';}
.about .con1{margin-bottom: 60px; background: #f7f7f7; padding: 50px 0;}
.about .con1 p{text-align: center; font-size: 35px; color: #004da0; font-weight: 700; line-height: 1.25; letter-spacing: 1px;}
.about .con2 p.sm{padding-bottom: 40px; text-align: center; font-size: 20px; color: #535353; line-height: 1.5; word-break: keep-all;}
.about .con2 p.big{text-align: center; padding-bottom: 40px; font-size: 25px; color: #000000; line-height: 1.25; word-break: keep-all; font-weight: 600;}

/* history */
.history .con1{display: flex; margin: auto; width: 1170px; padding-left: 20rem;}
.history .list{margin-top: 20px;}
.history .list > li{display: flex; position: relative;}
.history .list > li::before{content: ''; border-right: 2px solid #f1f1f1; position: absolute; left: 6px; top: 15px; height: calc(100% + 46px); z-index: -1;}
.history .list > li:last-child::before{display: none;}
.history .list > li + li{padding-top: 50px;}
.history .list > li li{display: flex;}
.history .list > li li + li{padding-top: 10px;}
.history .list_tit{font-size: 20px; color: #303030; width: 140px; background: url(../img/circle.png) no-repeat 0 9px; padding-left: 25px;background-size: 10%;}
.history .list_mon{font-size: 15px; color: #707070; width: 50px;}
.history .list_con{font-size: 17px; color: #555555; padding-top: 1px;}

/* vision */
.vision .con1{margin-bottom: 60px; padding: 50px 0;}
.vision .con1 img{display: flex !important; margin: auto; width: 80rem;}

/* contact */
.contact .con1{display: flex; margin: auto; width: 1170px; justify-content: center;}
.contact .con2{display: flex; margin: auto; width: 1170px; justify-content: center; margin-top: 5rem;}
.contact .con2 .txt{width: 800px; padding: 30px; border: 1px solid #dadada;}
.contact .con2 .tit{padding-bottom: 25px; font-size: 25px; color: #004da0; font-weight: 700;}
.contact .con2 .list > div{padding-bottom: 20px; display: flex;}
.contact .con2 .list i{vertical-align: middle; font-size: 2em; padding-right: 10px; top: -1;}
.contact .con2 .list p{width: calc(100% - 21px); padding-left: 10px; line-height: 1.25; word-break: keep-all; font-size: 18px; color: #4c4c4c; font-weight: 500; text-transform: none;}

/* qna */
.qna{padding: 120px 0;}
.qna-wrap{width: 100%; max-width: 1170px; margin: 0 auto;}
.qna-wrap .tit{display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 75px;}
.qna-wrap .tit .left{font-size: 40px; font-weight: 800;}
.qna-wrap .tit .right{font-size: 20px; font-weight: 500;}
.qna-wrap .tit .right span{color: #ff0000; display: inline-block; vertical-align: middle;}
form{display: block; unicode-bidi: isolate;}
.qna-wrap label{font-size: 18px; font-weight: 600; width: 180px; display: inline-block; margin-top: -20px; vertical-align: middle;}
.qna-wrap input.form{font-size: 16px; padding: 5px; height: 40px; margin-bottom: 20px; width: calc(100% - 185px); border: 1px solid #ccc; margin-bottom: 20px; vertical-align: middle; text-transform: none;}
.qna-wrap textarea{width: calc(100% - 185px); border: 1px solid #dadada; vertical-align: middle; margin-bottom: 20px; padding: 10px; font-size: large;}
.qna-wrap input.button{border: none; line-height: 1; background: #4d4d4d; width: 200px; border-radius: 10px; color: #fff; padding: 15px 0; text-align: center; font-size: 20px; font-weight: 500; margin: 60px auto 0; display: block; cursor: pointer;}
.required, textarea.required{background-image: url(../img/require.png) !important; background-repeat: no-repeat !important; background-position: right top !important;}

/* 개인정보 동의 */
.privacyChk {width: 600px; margin: auto;}
.faq-wrap{list-style: none; color: #2b2b2b; font-size: 0.9rem; cursor: pointer; border-bottom: 1px solid #ddd;}
.faq-wrap > li:not(.subs-mo){padding: 1.5rem;}
.faq-wrap > li{color: #2b2b2b; font-size: 1.6rem;}
.faq{display: flex; justify-content: space-between; align-items: center;}
.faq span{display: inline-block; font-weight: 600;}
.faq > i{margin-left: 1rem; transition: all 0.5s; transform: rotate(0); font-size: 1.5rem; color: #bbb;}
.faq > i.active{transform: rotate(180deg); color: #555;}

/* 체크박스 */
input[type="checkbox"] {width: 18px; height: 18px; appearance: none; -webkit-appearance: none; background-color: white; border: 2px solid #888; border-radius: 4px; cursor: pointer; position: relative; transition: all 0.2s ease; }
input[type="checkbox"]:checked {background-color: #0D328E; border-color: #0D328E;}
input[type="checkbox"]:checked::after {content: "✔"; color: white; font-size: 14px; position: absolute; top: -4px; left: 2px;}
input[type="checkbox"]:hover {border-color: #0D328E;}

.wrap{display: none;}
.wrap.on{display: block !important;}
.pc{display: block !important;}

/* media queries */
@media (max-width:991px) {
    html{font-size: 55%;}
    header{padding: 2rem;}
    section{padding: 2rem;}
    .home{background-position: left;}
}

@media (max-width:768px) {
    .title .content{height: 330px;}
    .title .txt{padding-top: 140px; margin-left: 20px;} 
    .title .txt p:first-child{padding-bottom: 13px; font-size: 26px;}
    .title .txt p:last-child{font-size: 13px;}
    
    .info_nav ul{max-width: 340px; height: 53px; margin-top: -50px;}
    .info_nav ul li p{font-size: 12px;}

    .selTit{padding-bottom: 18px; font-size: 30px;}
    
    .about{padding-bottom: 45px;}
    .about .con1{margin-bottom: 27px; padding: 30px 0;}
    .about .con1 p{font-size: 13px;}
    .about .con2{padding: 15px;}
    .about .con2 p.sm{padding-bottom: 22px; font-size: 11px;}
    .about .con2 p.big{padding-bottom: 13px; font-size: 17px;}

    .history .con1{padding-left: 5rem; width: 100%;}
    .history .list > li::before{left: 4px; top: 13px;}
    .history .list_tit{font-size: 13px; width: 88px; background: url(../img/circle.png) no-repeat 0 4px; padding-left: 23px; background-size: 10%;}
    .history .list_con{font-size: 13px; width: 245px;}

    .vision .con1{margin-bottom: 40px; padding: 12px 0;}
    .vision .con1 img{width: 350px;}

    .contact{padding-bottom: 20px;}
    .contact .con1{width: 100%;}
    .contact .con1 iframe{height: 300px;}
    .contact .con2{width: 360px; margin-top: 3rem;}
    .contact .con2 .txt{padding: 20px;}
    .contact .con2 .tit{padding-bottom: 11px; font-size: 16px;}
    .contact .con2 .list > div{padding-bottom: 10px; align-items: center;}
    .contact .con2 .list i{font-size: 1.5em;}
    .contact .con2 .list p{font-size: 11px;}

    .qna{padding: 50px 0;}
    .qna-wrap{max-width: 360px;}
    .qna-wrap .tit{padding-bottom: 36px;}
    .qna-wrap .tit .left{font-size: 25px; margin-left: 80px;}
    .qna-wrap .tit .right{font-size: 12px;}
    .qna-wrap label{width: 90px; font-weight: 400;}
    .qna-wrap input.form{width: calc(100% - 95px); height: 30px; margin-bottom: 10px;}
    .qna-wrap textarea{width: calc(100% - 95px); height: 120px;}
    .qna-wrap input.button{width: 75px; padding: 13px 0; font-size: 16px; margin: 0px auto 0;}

    .privacyChk {width: 363px; margin: auto;}
    input[name=submit] {margin-top: 18px !important;}
}