@charset "utf-8";
/* CSS Document */
#contents .doc.oh {overflow: hidden;}

/* Company - Overview */
.overview-con {overflow:hidden;}
.overview-con .overview-bg {padding: 3em 0; background:#f5f5f5; box-sizing:border-box;}
.overview-con .overview-bg .inner { overflow-x: visible; height:100%} 
.profile-list { gap:1.25em;}
.profile-list > li {width:calc(25% - 1em); border-radius: 20px; overflow: hidden;background: #fff; padding: 2.5em;} 
.profile-list > li .item-in {}
.profile-list > li .item-in .icon-img {width: 60px;}
.profile-list > li .item-in .profile-info {}

/* Company - Ceo */
.ceo-con .message .sign {width: 5em;}

/* Company - History */
.history-con .history-inner {transform: scale(1); /* height: 100vh; */ margin-bottom: 5em;}
.history-con .history-inner:last-child {margin-bottom: 0;}
.history-con .history-inner.reverse {flex-direction: row-reverse;}
.history-con .history-inner.reverse .history-left .img-wrap {margin-right: 0; margin-left: 3em; }
.history-con .history-left .img-wrap { top:10em; margin-right:3em; width: 55vw; margin-left: -22vw;}
.history-con .history-left .img-wrap .imgfix{ overflow: hidden; border-radius: 2em; height:calc(100vh - 15em)}
.history-con .history-inner .history-right {padding-left: 5em; box-sizing: border-box;}
.history-con .history-inner .history-right .item{ margin-bottom:15em;}
.history-con .history-inner .history-right .item .month {min-width: 3em;}

/* Company - Organization */
.organization-bg {background-position: 50% 100%;}
.organization-con {margin-bottom: 5em;}
.organization-con .img-wrap {width: 90%; margin: 0 auto;}

/* Company - Location */
/* .location-con {padding-top: 3em;} */
.location-con .location-inner {}
.location-con .location-inner .tab-wrap {padding-bottom: 1em; margin-bottom: 2em; border-bottom: 3px solid #ddd;}
.location-con .location-inner .tab-list > li {}
.location-con .location-inner .tab-list > li .tab-tt {color: #aaa; padding: 0.5em 1.25em; border-radius: 5em; overflow: hidden; transition: .3s;}
.location-con .location-inner .tab-list > li .tab-tt:before {content: ''; position: absolute; width: 0; height: 0; left: 50%; top: 50%; background: #04182e; border-radius: 50%; transform: translate(-50%, -50%); z-index: -1; transition: .5s;}
.location-con .location-inner .tab-list > li:hover .tab-tt:before, 
.location-con .location-inner .tab-list > li.on .tab-tt:before {width: 10em; height: 10em;}
.location-con .location-inner .tab-list > li:hover .tab-tt,
.location-con .location-inner .tab-list > li.on .tab-tt {color: #fff;}
.location-con .location-inner .conIdx {transition: .5s; opacity: 0; transform: translateY(50px);}
.location-con .location-inner .conIdx.on {opacity: 1; transform: translateY(0);}
.location-con .location-inner .conIdx .left {padding: 2em;}
.location-con .location-inner .conIdx .left .add-list {} 
.location-con .location-inner .conIdx .left .add-list > li {margin-bottom: 2em;} 
.location-con .location-inner .conIdx .left .add-list > li .icon {min-width: 4em;}
.location-con .location-inner .conIdx .left .add-list > li .icon .xi {background: #f5f5f5; border-radius: 50%; padding: 0.5em; overflow: hidden; color: #04182e;}


/* Member - Login */
.grd-bg {background-image: linear-gradient(to top, #e6e9f0 0%, #eef1f5 50%);}

.login_wrap {border-radius: 1em; margin-top: 2em; overflow: hidden; border: 1px solid #ddd; box-shadow: 0 0 30px rgba(0,0,0,0.05);}
.login_wrap .tab_st {background: #f8f8f8;}
.login_wrap .tab_st > li { padding: 1em; background: #f8f8f8; border-radius: -1em; position: relative; border-bottom: 1px solid #ddd;}
.login_wrap .tab_st > li > span {color: #888;}
.login_wrap .tab_st > li.on {border-bottom: 1px solid #fff; background: #fff;}
.login_wrap .tab_st > li.on > span {color: #333;}

.login_wrap .tab_st > li:after {content: url(../images/sub/login_round.svg); position: absolute; top: 0; right: -0.5em; background-size: contain; width: 1em; height: 100%; z-index: 11; opacity: 0;}
.login_wrap .tab_st > li.on:after {opacity: 1;}
.login_wrap .tab_st > li:last-child:after {left: -0.5em; right: auto; transform: rotateY(180deg);}

.login_wrap .login {padding: 2em; background: #fff;}
.login_wrap .login .inp-sec {margin-bottom: 1em; display: block;}
.login_wrap .login .inp-sec > input {padding-left: 3.5em; border-radius: 5px;}
.login_wrap .login .inp-sec > .xi {position: absolute;top: 50%; left: 0.75em; transform: translateY(-50%); display: inline-block; font-size: 1.5em; color: #888;}

.label_st:not(.cssbrowser) input[type=checkbox] ~ .xi:before {content: '\e92c';}
.label_st:not(.cssbrowser) input[type=checkbox]:checked ~ .xi:before {content: '\e92b';}
.label_st.de input[type=checkbox] {width: 0; height: 0; overflow: hidden; opacity: 0; color: #04182e;}
.label_st.de {color: #555;}

.login_wrap button.btn {height: 3em; font-size: 1.125em; margin-bottom: .5em;}
.bdrs {border-radius: 5px;}
.bdnBg { background: #f1f1f1; border: none;}
.login_wrap .link_wrap > li {position: relative;}
.login_wrap .link_wrap > li:first-child:before {content: ''; position: absolute; right: -0.8em; top: 50%; transform: translateY(-50%); width: 1px; height: 0.75em; background: #ddd;}

/* Member - Join */
.join_type > li .icon {margin: 2em 0; padding: 1em; background: #f5f5f5; border-radius: 50%; display: inline-block;}
.join_type > li .icon .xi {background: linear-gradient(120deg, #00dbde 0%, #fc00ff 100%); color: transparent;  -webkit-background-clip: text;}

/* Member - Join - Step */
.step_st {margin: 3em 0; justify-content: space-around;}
.step_st > li {}
.step_st > li .wrap_in {position: relative;}
.step_st > li .wrap_in:after {position: absolute; content: "\e93e"; font-family: xeicon; right: -2.5em; top: 0.2em; font-size: 1.25em; color: #aaa;}
.step_st > li.on .wrap_in .ico .xi {color: #fff;}
.step_st > li.on .wrap_in .ico .xi:before {}
.step_st > li.on .wrap_in .ico .xi:after {background: #232e64;}
.step_st > li:last-child .wrap_in:after {display: none;} 
.step_st > li .wrap_in .ico {}
.step_st > li .wrap_in .ico .xi {font-size: 2em; position: relative; color: #aaa;}
.step_st > li .wrap_in .ico .xi:after {content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background: #ddd; z-index: 0; border-radius: 50%; padding: 1rem;}
.step_st > li .wrap_in .ico .xi:before {position: relative; z-index: 1;} 
.step_st > li:nth-child(1) .wrap_in .ico .xi:before {content: "\ea8c";}
.step_st > li:nth-child(2) .wrap_in .ico .xi:before {content: "\ea26";}
.step_st > li:nth-child(3) .wrap_in .ico .xi:before {content: "\e998";}
.step_st > li:nth-child(4) .wrap_in .ico .xi:before {content: "\eb44";}

.step_st > li.on .wrap_in .tt {color: #232e64; font-weight: 500;}
.step_st > li .wrap_in .tt {margin-top: 2em; color: #aaa;}

.label_st input[type=checkbox], .label_st input[type=radio] {width: 0; height: 0; overflow: hidden; margin-bottom: 0;}
.label_st input[type=radio]:checked ~ .xi:before {content: "\e9c7";}
.label_st input[type=radio] ~ .xi:before {content: "\e9c6";}

.member_wrap .member_form{ padding:2.5em 2em; box-shadow: 0 0 30px rgba(0,0,0,0.05); border-top:3px solid #232e64; background: #fff;}
.member_wrap .member_form.st2{ border-top-width:4px; border-top-color:#232e64; background: #fff;}
.member_wrap .member_form.st3{ padding:0; border-top-color:#313851;}

.member_wrap .form > li:first-child{ margin-top:0;}
.member_wrap .form .inp_wrap{ position:relative; margin-top:.4em;}
.member_wrap .form .inp_wrap .xi{ position:absolute; z-index:2; top:0; left:0; width:4em; line-height:3.5em; text-align:center; font-size:1em; color:#3c3c3d;}
.member_wrap .form .inp_wrap .xi:before{ font-size:1.750em;}
.member_wrap .form .inp_wrap .inp{ box-sizing:border-box; width:100%; height:3.5em; padding:0 1em 0 4.5em; background:#fff; border:1px solid #ddd; color: #888; font-weight: 400; }
.member_wrap .form .inp_wrap .inp_sel{ background:transparent;}
.member_wrap .form .inp_wrap .inp:focus{ border-color:#232e64;}
.member_wrap .form .inp_wrap textarea { border-radius:.3em;}
.member_wrap .form .btn_wrap{ margin-top:1.2em;}
.member_wrap .form .btn_wrap .btn{ margin:.4em 0; font-size:1.125em;}
.member_wrap .form .btn{ display:block; box-sizing:border-box; text-align:center; width:100%; padding:.8em 1em; border:1px solid #232e64;}
.member_wrap .form .btn.c1{ background:#232e64; color:#fff;}
.member_wrap .form .btn.c2{ background:#ffffff; color:#232e64;}
.member_wrap .form .etc_wrap{ margin-top:1.5em;}
.member_wrap .form .etc_wrap .find{ text-align:right; display:inline-block;}
.member_wrap .form .etc_wrap .find.left1{ text-align:right; display:inline-block; margin-left: 13em;}
.member_wrap .form .etc_wrap .find .link{ position:relative; display:inline-block; *display:inline; zoom:1; vertical-align:middle; margin-left:.8em; padding-left:.8em;}
.member_wrap .form .etc_wrap .find .link:before{ content:""; position:absolute; top:10%; left:0; width:1px; height:80%; background:#ccc;}
.member_wrap .form .etc_wrap .find .link:first-child{ margin-left:0; padding-left:0;}
.member_wrap .form .etc_wrap .find .link:first-child:before{ display:none;}
.member_wrap .form .etc_wrap .find .link:hover{ text-decoration:underline;}
.member_wrap .form .id_wrap{ padding:3em 1em; background:#f5f5f5; border:1px solid #e5e5e5; text-align:center; font-size:1.125em;}
.member_wrap .form .id_wrap strong{ vertical-align:baseline; color:#232e64; letter-spacing:0;}
.member_wrap .form .pw_wrap{ padding:3em 1em; background:#f5f5f5; border:1px solid #e5e5e5; text-align:center; font-size:.938em; color:#3c3c3d; line-height:1.8;}

.member_wrap .form .cer_wrap > li{ width:33.33%; text-align:center;}
.member_wrap .form .cer_wrap > li .inner{ margin:0 1px; padding:1em .6em; background:#ecf0f4;}
.member_wrap .form .cer_wrap .icon .in{ display:inline-block; width:4em; height:4em; background:#fff; border-radius:100%;}
.member_wrap .form .cer_wrap .icon .in img{ max-height:2.5em;}
.member_wrap .form .cer_wrap .txt{ margin-top:1em; height:3em;}
.member_wrap .form .cer_wrap .btn{ padding:.4em .4em;}

.member_wrap .terms_wrap .all_check{ padding:1em 0; border-bottom:1px dashed #bbb; font-size:1.063em;}
.member_wrap .terms_wrap > li{ padding-top:2em;}
.member_wrap .terms_wrap > li:first-child{ padding-top:0;}
.member_wrap .terms_wrap .tit{ margin-bottom:.6em; font-size:1.250em; color:#3c3c3d; font-weight:500}
.member_wrap .terms_wrap .tit *{ vertical-align:baseline;}
.member_wrap .terms_wrap .c1{ color:#d82744;}

.member_btn_wrap{ margin:1.5em 0 0 -.4em; text-align:center;}
.member_btn_wrap > li{ width:50%;}
.member_btn_wrap .in{ margin-left:.4em;}
.member_btn_wrap .input_st{ width:100%; min-width:40% !important; }

.member_agree .agree{ padding:3em; border:solid #ddd; border-width:2px 1px 1px 1px; border-top-color:#333; font-size:.938em; color:#777; line-height:1.5em;}
.member_agree .agree.H{ padding:1em 1.5em; border-top-width:1px; height:10em; overflow-y:scroll;}
.member_agree .agree p{ padding:.5em 0;}
.member_agree .agree *{ vertical-align:baseline;}
.member_agree .agree strong{ color:#333;}
.member_agree .check{ padding:1em 2em; border:solid #ddd; border-width:0 1px 1px 1px; text-align:right;}

.member_wrap .member_form .form2 > li {margin-bottom: 1em;}
.member_wrap .member_form .form2 > li .txt {margin-bottom: 0.5em; display: inline-block;}
.member_wrap .member_form .form2 > li input[type=text]:focus,
.member_wrap .member_form .form2 > li input[type=password]:focus {border: 1px solid #00dbde;}
.member_wrap .member_form .form2 > li .col-wrap {gap: 0.5em;}
.member_wrap .member_form .form2 > li .col-wrap .col_w3 {flex: 1;}

.myinfo_wrap { position: relative; margin-top: 2em;}
.myinfo_wrap .myinfo_modal { position: absolute; background: #fff; border: 1px solid #ddd; padding: 0.7em; display: none; }
.myinfo_wrap .myinfo_modal.m1 { left: 9em; top: 11em; }
.myinfo_wrap .myinfo_modal.m2 { left: 9em; top: 15em; }
.myinfo_wrap .myinfo_modal.m3 { left: 9em; top: 19em; }
.myinfo_wrap .myinfo_tit { /*border-top: 2px solid #333;*/ border-bottom: 1px solid #666; padding: 1em .5em; }
.myinfo_wrap .myinfo_con { border-bottom: 1px solid #ddd; }
.myinfo_wrap .myinfo_con .tit { width: 13em; background: rgb(248, 248, 248); padding: 1em 0; }
.myinfo_wrap .myinfo_con .tit > .circle > .xi { font-size: .95em; padding-left: .3em; color: #ff473e; }
.myinfo_wrap .myinfo_con .txt { flex: 1; padding: 1em 0 1em 1em; }
.myinfo_wrap .myinfo_con .txt.situation { flex: 1 1 12.16%; max-width: 12.16%; }
.myinfo_wrap .myinfo_con .txt.situation > a > .t14 { display: inline; }
.myinfo_con.st2 {border-top:1px solid #ddd;}

.member_wrap .member_form .pl-box {padding-left: 3.5em; border-radius: 5px;}
.member_wrap .member_form .form .inp-sec > .xi {position: absolute; left: 0.75em; top: 50%; transform: translateY(-50%); display: inline-block; font-size: 1.5em; color: #888;}
.member_wrap .member_form .form .inp-sec {margin-bottom: 1em; display: block;}

/* estimate */
.estimate-table {border-top: 3px solid #232e64;}
.estimate-table .input_st:not(select) {background: #f3f5f8; border: none; border-radius: 5px;}
.estimate-table tbody {}
.estimate-table tbody tr {border-bottom: 3px solid #eee;}
.estimate-table tbody tr th,
.estimate-table tbody tr td {padding: 1em; font-size: 1.125em; }
.estimate-table tbody tr th {background: #fff; color: #555; font-weight: 700; text-align: left;}
.estimate-table tbody tr th .tit {}
.estimate-table tbody tr td {color: #777; line-height: 1.5em; font-weight: 500;}
.estimate-table tbody tr td .info {}
.estimate-table .table_form > li {border: none;}
.estimate-table .board_viewF {background: transparent; border: none; padding: 0;}


/* Partnership */
.partner-container {margin-top: 3em;}
.partner-container .partner-inner {}
.partner-container .partner-inner .p-list {}
.partner-container .partner-inner .p-list > li {flex: 1 1 25%; max-width: 25%; display: flex; align-items: center; justify-content: center;}
.partner-container .partner-inner .p-list > li .img-wrap {padding: 3em; box-sizing: border-box;}
.partner-container .partner-inner .p-list > li .img-wrap .imgfix > img {filter: grayscale(1); transition: .5s;}
.partner-container .partner-inner .p-list > li .img-wrap:hover .imgfix > img {filter: grayscale(0);}

/* Business - Center */
.center-container {}
.center-container .center-inner {}
.center-container .list-wrap {counter-reset: listNum;}
.center-container .list-wrap > li { gap: 3em; margin-bottom: 7em; counter-increment: listNum;}
.center-container .list-wrap > li:nth-child(even) {flex-direction: row-reverse;}
.center-container .center-img-wrap {min-width: 53.75em; height: 55vh; position: relative; z-index: 11;}
.center-container .center-img-wrap .img-wrap {width: 100%; height: 100%; border-radius: 2em; overflow: hidden; }
.center-container .center-txt-wrap {padding: 1em 0;}
.center-container .center-txt-wrap .number {margin-bottom: 2em; display: inline-block; position: relative;}
.center-container .center-txt-wrap .number:before {content: ''; position: absolute; left: calc(100% + 1em); top: calc(50% - 1px); width: 35vw; height: 3px; background: #ddd; z-index: -1;}
.center-container .center-txt-wrap .number:after {content: counter(listNum);  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: #fff; font-size: 1.25em; font-weight: bold;}
.center-container .center-txt-wrap .number .num-bg {background: #04182e; border-radius: 1em; padding: 0.75em 1em;}
.center-container .center-txt-wrap .title {margin-bottom: 2rem;}
.center-container .center-txt-wrap .info {}

/* Business - logistics */
.system-container {}
.system-container .system-inner {}
.system-container .list-item {}
.system-container .list-item > li {margin-bottom: 7em;}
.system-container .list-item > li .img-wrap {margin-bottom: 2em; height: 37.5em; overflow: hidden;}
.system-container .list-item > li .img-wrap .imgfix > img {object-position: center bottom; transform: scale(1.2); transition: 1s;}
.system-container .list-item > li .img-wrap.aos-animate .imgfix > img {transform: scale(1);} 
.system-container .list-item > li .txt-wrap {}
.system-container .list-item > li .txt-wrap .left {max-width: 21.875em;}
.system-container .list-item > li .txt-wrap .right {margin-top: 0.75em;}

/* Custom file */
.filebox .upload-name {height: 3em; padding: 0 10px; vertical-align: middle; border: 1px solid #ddd; width: 80%; color: #767676;}
.filebox label {padding: 10px 20px; color: #fff; background-color: #999; cursor: pointer; height: 3em; margin-left: 10px; border-radius: 5px; display: flex; align-items: center; justify-content: center; width: 30%; min-width: 6.25em;}
.filebox input[type="file"] {position: absolute; width: 0; height: 0; padding: 0; overflow: hidden; border: 0;}

/*srinquiry service*/
.divi_table{}
.divi_table .divi_ttl{}
.divi_table .divi_ttl > p{ font-size: 2.25em; font-weight: 700;}

.form_label_wrap{ }
.form_label_wrap > li{margin:.5em 0; box-sizing:border-box}
.form_label_wrap.st1 > li {flex:1 0 33.33%; max-width: 33.33%;}
.form_label_wrap.st2 > li {flex:1 0 25%; max-width: 25%;}

.form_label_st:not(.cssbrowser) input ~ .xi.st1{ padding-right:0; padding-left:.125em; font-size:1em}
.form_label_st:not(.cssbrowser) input ~ .xi.st1:before{ content:"\e929"; opacity:0}
.form_label_st:not(.cssbrowser) input:checked ~ .xi.st1:before{ content:"\e929"; opacity:1}

.form_label_st{ display:inline-block; *display:inline; zoom:1; cursor:pointer}
.form_label_st > *{ display:inline-block; *display:inline; zoom:1; vertical-align:middle; cursor:pointer;}
.form_label_st > .xi{ font-size: 1.15em;}
.form_label_st:not(.cssbrowser) .xi:before{ font-family:xeicon!important; font-style:normal; font-size:1.25em; padding-right:.25em}
.form_label_st:not(.cssbrowser) input ~ span{ color:#666}
.form_label_st:not(.cssbrowser) input ~ .xi:before{ color:#aaa}
.form_label_st:not(.cssbrowser) input:checked ~ span{ color:#333}
.form_label_st:not(.cssbrowser) input:checked ~ .xi:before{ color:#0b4790}
.form_label_st:not(.cssbrowser) input[type=checkbox] ~ .xi:before{ content:"\e92e"}
.form_label_st:not(.cssbrowser) input[type=checkbox]:checked ~ .xi:before{ content:"\e92d"}
.form_label_st:not(.cssbrowser) input:radio ~ span{ color:#333}
.form_label_st:not(.cssbrowser) input:radio ~ .xi:before{ color:#0b4790}
.form_label_st:not(.cssbrowser) input[type=radio] ~ .xi:before{ content:"\e92e"}
.form_label_st:not(.cssbrowser) input[type=radio]:checked ~ .xi:before{ content:"\e92d"}
.form_label_st:not(.cssbrowser) input[type=checkbox],
.form_label_st:not(.cssbrowser) input[type=radio]{ width:0; height:0; overflow:hidden;}
