

/******************************************************************
           Common Style Css 
********************************************************************/


section {
  display: flex;
  flex-direction: column; justify-content: flex-start; align-items: center;
}
section .inner {
  width: 100%;
  max-width: 1200px;
}
.card-box {
  position: relative;
  width: 100%;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-1);
  padding: 24px;
}
.card-box > h2,
.card-box div > h2 {
  font-weight: 600;
  word-break: keep-all;
}
.card-box > p,
.card-box div > p {
  font-weight: 400;
}


/************************************************** Header ****************/
header {
  position: relative; z-index: 1;
  background-color: var(--color-white);;
  width: 100%; height: 75px;
  border-bottom: 1px solid var(--color-border-1);
}
header .inner {
  display: flex;
  flex-direction: row; align-items: center; justify-content: space-between;
  width: 1200px; height: 100%;
  margin: 0 auto;
}
header .inner .logo > a {
  display: block;
}
.logo {
  display: flex;
  justify-content: flex-start; align-items: center;
}
header .inner .gnb {
  height: 100%
}
header .inner .gnb > ul {
  display: flex;
  flex-direction: row;
  height: 100%
}
header .inner .gnb > ul li a.memu {
  position: relative;
  display: flex;
  justify-content: center; align-items: center;
  padding: 0 16px; height: 100%;
  font-weight: 600;
  color: var(--color-fontGray);
}
header .inner .gnb > ul li a.active {
  color: var(--color-point);
}
header .inner .gnb > ul li a.active::before {
  content: "";
  position: absolute; bottom: 0; left: 50%;
  transform: translateX(-50%);
  width: 28px; height: 5px;
  border-radius: var(--radius-16);
  background-color: var(--color-point);
}


/************************************************** Footer ****************/
footer {
  display: flex;
  justify-content: center; align-items: center;
  border-top: 1px solid var(--color-border-1);
  margin-top: 24px; padding-bottom: 24px;
}
footer .inner {
  width: 1200px;
  padding-top: 16px;
}
footer .inner .menu-box > .row {  
  display: flex;
  flex-direction: row; justify-content: flex-start; align-items: center;
}
.menu-box > .row .menu  {
  position: relative;
  padding: 8px 16px; font-weight: 600;
}
.menu-box > .row .menu:first-child {
  padding-left: 0;
}
.menu-box > .row .menu:before {
  content: "";
  position: absolute; top: 10px; right: 0px;
  width: 1.5px; height: 13px; 
  background-color: var(--color-border-1);
}
.menu-box > .row .menu:last-child:before {
  content: "";
  width: 0px; height: 0;
}
.address-box .row:first-child {
  padding-top: 8px;
}
.address-box .row {
  display: flex; flex-direction: row; 
}
.address-box .row .col {
  position: relative;
  color: var(--color-fontGray); font-weight: 400;
  padding: 4px 16px;
}
.address-box .row .col:before {
  content: "";
  position: absolute; top: 7px; right: 0px;
  width: 1.5px; height: 10px; 
  background-color: var(--color-border-1);
}
.address-box .row .col:first-child {
  padding-left: 0;
}
.address-box .row .col:last-child:before {
  content: "";
  width: 0px; height: 0;
}



/******************************************************************
           Main Style Css 
********************************************************************/
.main-visual {
  position: relative;
  width: 100%; height: 336px;  
  max-width: 1200px;
  overflow: hidden;
}
.main-visual .main-copy {
  margin-top: 80px;
}
.main-visual .main-copy h2 {
  font-weight: 600; color: var(--color-fonts);
}
.main-visual .main-copy .details {
  word-break: keep-all;
  max-width: 435px;
  font-weight: 600;
}
.main-visual .main-copy > p {
  font-weight: 500;
}

.main-visual .visual-img  {
  width: 100%; height: 100%;
}
.main-visual .visual-img .airplane {
  position: absolute; top: 41px; right: 53px;
  z-index: 1;
}
.main-visual .visual-img .travel {
  position: absolute; top:37px; right: 116px;
  z-index: -1;
}



/******************************************************************
           Section Style Css 
********************************************************************/
.section01 .inner {
  display: grid;
  grid-template-columns: repeat(2, 1fr); gap: 1.5em;
  margin-bottom: 40px;
}
.section01 .card-box > p {
  color: var(--color-fontGray);
  width: 65%;
}
.section01 .card-box .icon {
  position: absolute; bottom: 24px; right: 24px;
}
.section01 .card-box .icon .svg-icon svg {
  stroke: var(--color-fontGray);
}
.section01 .card-box:last-child .icon .svg-icon svg {
  fill: var(--color-fontGray);
}
.section01 .card-box:hover {
  background-color: var(--color-point);
  border-color: var(--color-point);
}
.section01 .card-box:hover > h2 {
  color: var(--color-white);
}
.section01 .card-box:hover > p {
  color: rgba(255, 255, 255, .58)
}
.section01 .card-box:hover .icon .svg-icon svg {
  stroke: var(--color-white);
}
.section01 .card-box:last-child:hover .icon .svg-icon svg {
  fill: var(--color-white);
}
.section01 .card-box:hover a.primary {
  background-color: var(--color-white);
  color: var(--color-fonts);
}
.section01 .card-box > p span {
  color: #009DD7;
}
.section01 .card-box:hover > p span {
  color: #f6ff1a;
}


.section02 .inner {
  display: flex;
  flex-direction: column; align-items: flex-start;
  margin: 40px 0;
}
.section02 .inner .copyright h3 {
  font-weight: 600;
  color: var(--color-fonts);
  /*width: 435px;*/
  width: 100%;
  word-break: keep-all;
}
.section02 .inner .copyright > p,
.section02 .card-box > p {
  color: var(--color-fontGray);
}
.section02 .inner .row {
  display: grid;
  grid-template-columns: repeat(3, 1fr); gap: 1.5em;
  margin-top: 70px;
}
.section02 .card-box {
  display: flex;
  flex-direction: column; justify-content: space-between;
}
.section02 .card-box .icon {
  display: flex;
  flex-direction: row; justify-content: flex-end; align-items: flex-end;
}
.section02 .card-box .icon .svg-icon {
  display: flex;
  justify-content: center; align-items: center;
  width: 88px; height: 88px;
  background-color: var(--color-bg-2);
  border-radius: 100%;
}


.section03 .inner {
  display: flex;
  flex-direction: column; align-items: flex-start;
  margin: 40px 0;
}
.section03 .inner > h2 {
  font-weight: 600;
}
.section03 .inner > ul li {
  font-weight: 500;
  word-break: keep-all;
  padding: 4px 0;
  color: var(--color-fontGray);
  text-indent: -12px;
  padding-left: 12px;
}
.section03 .inner .details {
  padding: 24px;
  background-color: var(--color-bg-2);
  border: 1px solid var(--color-border-1);
}
.section03 .inner .details > h3 {
  font-weight: 600;
}
.section03 .inner .details > p {
  padding: 4px 0;
  color: var(--color-fontGray);
}
.section03 .inner .details > p > strong {
  font-weight: 600; color: var(--color-fonts);
}


/******************************************************************
          mobile Style Css 
********************************************************************/

@media (max-width: 1400px) {
  header .inner {
    width: 100%;
    padding: 0 16px;
  }
  section .inner {
    max-width: calc(100% - 5% - 5%);
  }
  footer .inner {
    width: calc(100% - 5% - 5%);
  }
}

@media (max-width: 999px) {
  .main-visual .main-copy {
    margin: 2rem 5%;
  }
  .main-visual .visual-img .airplane, .main-visual .visual-img .travel {
    max-width: 48%;
  }
  .main-visual .visual-img .travel {
    position: absolute;
    top: 90px; right: 5%;
  }
  .address-box .row {
    display: flex;
    flex-direction: column;
  }
  .address-box .row .col {
    padding-left: 0;
  }
  .address-box .row .col:before {
    content: "";
    width: 0px; height: 0;
  }
}

@media (max-width: 700px) {
  header{
    height: 58px
  }
  header .inner .logo {
    height: 26px
  }
  header .inner .logo img {
    width: auto; height: 100%;
  }
  .main-visual {
    max-width: 100%; height: 300px;
	position: relative;
  }
  .main-visual .main-copy {
    position: relative; z-index: 2;
    margin: 2rem 1rem;
  }
  .main-visual .main-copy .fs-38 {
    font-size: var(--font-22);
  }
  .main-visual .main-copy .fs-28 {
    font-size: var(--font-18);
  }
  .main-visual .visual-img {
    position: absolute;
    top: 0; right: 0;
  }
  .main-visual .visual-img .airplane {
    position: absolute;
    top: 38px; right: 0px;
    width: 38%;
  }
  .main-visual .visual-img .travel {
    position: absolute;
    top: auto; right: 5%; bottom: -36px;
	width: 100%; max-width: 70%;
  }
  .card-box.mobile {
    display: flex;
    flex-direction: row; justify-content: space-between; align-items: flex-start;
  }
  .section02 .card-box.mobile .icon.mt26 {
    margin-top: 0;
  }
  .card-box.mobile .col-box {
    display: flex;
    flex-direction: column; justify-content: flex-start; align-items: flex-start;
	width: calc(100% - 100px);
  }
  .card-box > h2.fs-28,
  .card-box.mobile .col-box > h2.fs-28 {
    font-size: var(--font-20);
    line-height: 1.2;
  }
  .card-box > p.fs-16,
  .card-box.mobile .col-box > p.fs-16 {
    font-size: var(--font-14);
  }
  .section02 > a.button.primary.middle.fs-18 {
    font-size: var(--font-14);
	width: 80%;
  }
  .section02 .inner , .section03 .inner {
    margin: 1.5rem 0;
  }
  .section02 .inner {
    margin-bottom:  0rem
  }
  .section01 .inner {
    grid-template-columns: repeat(1, 100%);
    margin-bottom: 1.5rem;  
  }
  .section01 .card-box .icon {
    position: absolute;
    bottom: 16px; right: 16px;
  }
  .section02 .inner .row {
    grid-template-columns: repeat(1, 100%);
    gap: 1.5em;
    margin-top: 30px;
	width: 100%;
  }
  .section02 .inner .copyright h3 {
    width: 100%;
  }
  .section03 .inner > h2.fs-28 {
    font-size: var(--font-20);
  }
  .section02 .inner .copyright h3.fs-28 {
    font-size: var(--font-20);
  }
  .section03 .inner .details > h3.fs-22 {
    font-size: var(--font-20);
  }
  .section03 .inner > ul li.fs-16,
  .section03 .inner .details > p.fs-16 {
    font-size: var(--font-14);
  }
  footer .inner .menu-box > .row {
    flex-wrap: wrap;
  }
  .menu-box > .row .menu {
    padding: 4px 12px;
  }
  .menu-box > .row .menu.fs-16 {
    font-size: var(--font-14);
  }
  .menu-box > .row .menu:nth-last-child(3n+1) {
    padding-left: 0;
  }
  .menu-box > .row .menu:before {
    content: "";
    position: absolute;
    top: 7px;
    width: 1.5px; height: 12px;
  }
  .address-box .row .col {
    padding-right: 0;
  }
}

/* POPUP */
#black {display:none; background-color: #000; display: none; height: 100%; left: 0; opacity: 0.6; filter: alpha(opacity=60); position: fixed; top: 0; width: 100%; z-index: 9999;}
.layerPop {-webkit-overflow-scrolling: touch; overflow-y: auto; width: 100%; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 99999; background:url(/tscommon/img/common/png_70.png) repeat left top;/*background:#d7d7d7;*/ zoom: 1;}

.layerPop_inner {width: 100%; height: 100%; padding: 15px; display: table; position: relative; margin: 0 auto; box-sizing: border-box;}
.pop_wrap {display: table-cell; vertical-align: middle; position: relative;}
.pop_wrap .pop_body {padding:15px 20px 20px 15px; font-size:1.05em; line-height: 150%; background: #fff; word-break: keep-all;}
.pop_wrap .pop_body .btns {padding-top: 20px;}
.pop_wrap .pop_wrap_in {width:100%; margin: 0 auto;}

.pop_wrap .x_btn {position: absolute; right:25px; top:50%; margin-top: -13px; display: inline-block; width:26px; height: 26px; cursor: pointer; background: none}
.pop_wrap .pop_head {background:var(--bis-color-point); position: relative;}
.pop_wrap .pop_head .title {font-size:24px; line-height:150%;  color: #fff; padding:15px 45px 15px 25px; text-align: left; font-weight:500;}
.pop_wrap .pop_head .title .small {font-size:18px; font-weight:100;}
.pop_wrap .pop_head .title.tc {padding:15px 45px 20px 45px;}
.pop_wrap .pop_head .s_txt {font-size:14px; line-height:14px;  color: #646464; text-align: center; padding: 0px 0px 30px 0px;}
.pop_wrap .x_btn2 {position: absolute; right:0px; bottom:0px; }

.pop_body .btn-tc {padding: 20px 0px 0px 0px; margin-top:15px;}
.pop_body .btn-tc > a {margin: 0px 10px;}

.pop_wrap .pop_wrap_in.mini {border: 1px solid var(--bis-color-point); box-shadow:1px 2px 3px #000;}
.pop_wrap .pop_wrap_in.mini .pop_head {background: #fff;}
.pop_wrap .pop_wrap_in.mini .pop_head .title {color: var(--bis-color-point); padding: 15px 45px 15px 15px; font-size:18px;}
.pop_wrap .pop_wrap_in.mini .x_btn {right:10px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); display: inline-block; width:40px; height:40px; margin: 0px; cursor: pointer; background: none}


/* �˾� */

.popup_scroll {max-height:400px; overflow-x:hidden; overflow-y:auto;}

.layers_wrap {background:#FFF; position:relative; min-width:300px;}
.layers_wrap .layers_tit {width:100%; padding:15px 0px; line-height:150%; background:#7c50a0;  text-align: center; font-size:1.8em; color:#fff; position:relative;}
.layers_wrap .layers_tit .logo {padding-left:25px; padding-top:20px;}
.layers_wrap  .close_pop { position:absolute; right:25px; top:17px;}
.layers_wrap .layers {padding:20px; font-size: 14px; position:relative; /*min-height:100px; max-height:760px; overflow-x:hidden; overflow-y:auto; -webkit-print-color-adjust:exact;*/}

.layers_wrap .close {height:30px; border-top:none; text-align:right; background:#e2e2e2; line-height:30px;}
.layers_wrap .close a { display:inline-block; zoom:1; *display:inline; font-family:Noto Sans; color:#2d2d2d; padding-right:20px; background:url(http://pic.neungyule.com/newnetimes/img/btn/pop_close_s.gif) no-repeat right center; margin-right:10px;}
.layers_wrap .pop_tit {padding-left:5px; border-bottom:1px solid #afafaf; min-height:41px; padding-bottom:3px; font-family:Noto Sans; color:#444444; font-size:22px; line-height:41px;}
.layers_wrap .pop_tit.ico_check2 { font-size:13px; min-height:20px; padding:10px 10px 10px 50px; background:url(../img/common/ico_check2.gif) no-repeat 10px 10px #f9f9f9; line-height:150%; border-bottom:none;}
.layers_wrap .pop_tit_no {min-height:38px; font-family:Noto Sans; color:#444444; font-size:22px; line-height:38px;}

