#header {
  background: #fff;
}

#container {
  min-height: calc(100vh - 38rem);
}
@media screen and (max-width: 768px) {
  #container {
    min-height: calc(100vh - 203px);
  }
}

#visual {
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  background-origin: content-box;
  color: #fff;
}
#visual .tit_visual .wfix {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
  height: 40rem;
  padding-bottom: 6rem;
}
#visual .tit_visual .wfix .sup {
  display: block;
  font-size: 1.8rem;
  color: var(--color-primary);
  font-weight: 600;
}
#visual .tit_visual .wfix .title {
  font-size: 4.8rem;
  font-weight: 600;
  color: #000;
}
#visual.wide {
  position: relative;
  overflow: hidden;
}
#visual.wide:before, #visual.wide:after {
  position: absolute;
  content: "";
  pointer-events: none;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding-top: 10rem;
  box-sizing: border-box;
  background: inherit;
  background-size: auto 100%;
  background-origin: content-box;
}
#visual.wide:before {
  display: none;
  transform: scaleX(4);
  filter: blur(2.4rem) saturate(0.9);
}
@media screen and (min-width: 3841px) {
  #visual.wide:before {
    display: block;
  }
}
#visual.wide .tit_visual {
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 1024px) {
  #visual .tit_visual .wfix {
    height: 250px;
    padding-bottom: 30px;
  }
  #visual .tit_visual .wfix .sup {
    font-size: 12px;
  }
  #visual .tit_visual .wfix .title {
    font-size: 24px;
  }
  #visual.wide:after {
    padding-top: 60px;
  }
}

.submenu {
  background: #fff;
  border-bottom: 1px solid #ddd;
}
.submenu .list_menu {
  display: flex;
  gap: 6rem;
}
.submenu .list_menu a {
  display: flex;
  align-items: center;
  height: 8rem;
  font-size: 1.8rem;
  color: #000;
  font-weight: 600;
  transition: 0.2s;
}
.submenu .list_menu span {
  display: inline-block;
  line-height: 3.2rem;
/*	width: 100%;*/
}
.submenu .list_menu .on a {
  color: var(--color-primary);
}
.submenu .list_menu .on span {
  border-bottom: 2px solid var(--color-primary);
}
@media screen and (min-width: 1400px) {
  .submenu .list_menu a:hover {
    color: var(--color-primary);
  }
}
@media screen and (max-width: 1560px) {
  .submenu .wfix {
    padding: 0;
  }
  .submenu .list_menu {
    overflow: auto;
    scrollbar-width: none;
    padding: 0 20px;
  }
  .submenu .list_menu li {
    flex-shrink: 0;
  }
}
@media screen and (max-width: 1024px) {
  .submenu {
    position: relative;
  }
  .submenu:before, .submenu:after {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 20px;
    background: linear-gradient(to right, rgb(255, 255, 255) 10%, rgba(255, 255, 255, 0) 100%);
    content: "";
  }
  .submenu:before {
    left: 0;
  }
  .submenu:after {
    width: 40px;
    right: 0;
    transform: rotate(180deg);
  }
  .submenu .list_menu {
    gap: 30px;
  }
  .submenu .list_menu li {
/*    flex-grow: 1;*/
  }
  .submenu .list_menu li:last-child {
    padding-right: 12px;
  }
  .submenu .list_menu a {
    justify-content: center;
    font-size: 12px;
  }
}

#contents {
  padding: 10rem 0;
}
@media screen and (min-width: 1024px) {
  #contents:has(.menu_side) {
    padding: 0;
  }
  #contents:has(.menu_side) .wfix {
    display: flex;
  }
  #contents:has(.menu_side) .group_section {
    flex-grow: 1;
    padding: 12rem 0;
	  min-width: 0;
  }
}

@media screen and (min-width: 1520px) {
  #contents:has(.menu_side) .group_section {
    max-width:1270px;
  }
}

.menu_side {
  position: relative;
  width: 25rem;
  flex-shrink: 0;
}
.menu_side .list {
  position: sticky;
  top: 0;
  padding: 12rem 0;
}
.menu_side li + li {
  margin-top: 0.5rem;
}
.menu_side a {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 4rem;
  padding-right: 1.2rem;
  font-size: 1.8rem;
  color: #777;
  transition: 0.3s;
}
.menu_side li.on a {
  font-weight: 600;
  color: var(--color-primary);
}
.menu_side li.on a:after {
  position: absolute;
  top: 1.5rem;
  right: 0;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 100%;
  background: var(--color-primary);
  content: "";
}
@media screen and (max-width: 1024px) {
  .menu_side {
    display: none;
  }
}


[class^=section] {margin-bottom: 15rem}
[class^=section]:last-child {margin-bottom: 3rem}
@media screen and (max-width: 768px) {
	[class^=section] {margin-bottom: 80px}
	[class^=section]:last-child {margin-bottom: 30px}
}

.pc {display: block}
.mo {display: none}
@media screen and (max-width: 768px) {
	.pc {display: none}
	.mo {display: block}
}

.head_comm .sup {
  display: block;
  margin-bottom: 0.4em;
  font-size: 1.8rem;
  font-weight: 600;
  color: var(--color-primary);
}
.head_comm .title {
  display: block;
  font-size: 4.8rem;
  font-weight: 600;
  line-height: 1.25;
}
.head_comm .desc {
  line-height: 1.33;
  color: #333;
  word-break: keep-all;
  margin-top: 2rem;
}
@media screen and (max-width: 1024px) {
  .head_comm .sup {
    font-size: 12px;
  }
  .head_comm .title {
    font-size: 24px;
  }
  .head_comm .desc {
    font-size: 12px;
  }
}

.cursor {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.2s;
  z-index: 8;
  cursor: none;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
  width: 10rem;
  height: 10rem;
  border-radius: 100%;
  background: rgba(255, 100, 0, 0.6);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  box-shadow: inset 0 0 6px rgba(255, 255, 255, 0.6);
}
.cursor span {
  color: #fff;
  font-size: 1.6rem;
}

.cursor:before, .cursor:after {
  display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  background: url(../img/icon_arrow03.svg) no-repeat center/contain;
  filter: invert(1);
  content: "";
}
.cursor:before {transform: rotate(90deg);}
.cursor:after {transform: rotate(-90deg);}
.cursor.on {
  opacity: 1;
}
@media screen and (max-width: 1024px) {
  .cursor {
    display: none;
  }
}



.contents {margin-top: 2rem}
.linebox {border:1px solid #ddd; border-radius: 1.5rem}
.graybox {background: #f9f9f9; border-radius: 1.5rem}
.boxtxt {display: inline-block; padding: .4rem 1.5rem;color:var(--color-primary);font-weight: 600; border:1px solid #ffd3bf; border-radius: 1rem;  background-color: #fff1eb;}

/*.disc {display: flex; align-items: center; gap: 1rem}*/
.disc {position: relative; padding-left: 1.5rem}
.disc:before {content: ''; position: absolute; top: .6em; left:0; width: .5rem; height:.5rem; border-radius: 100px; background: var(--color-primary); }

.slider_wrap {width:100%; cursor: none; user-select: none;overflow: hidden}
.slider {gap:1rem; max-width: 1270px; display: flex}
.slider .slide_arr {width:4.5rem; min-width:4.5rem; background: url(../img/arr_g.png) no-repeat center/contain;}
.slider_wrap {overflow: auto; overflow: scroll; overflow-x: scroll; overflow-y: auto; scrollbar-width:none; -ms-overflow-style:none;}
.slider_wrap::-webkit-scrollbar { display: none; }

.tab_wrap {position: relative; width:100%; overflow-x: auto; overflow-y: hidden;user-select: none;cursor: grab;}
.tab_wrap::-webkit-scrollbar { display: none; }
.tab_wrap ul { display: flex; }

/*
.tab_wrap:before {content: ''; width:2rem; height: 37px; background: #fff;position: absolute;top:0; left:0; display: none}
.tab_wrap:after {content: ''; width:2rem; height: 37px; background: #fff;position: absolute;top:0; right:0; display: none}
*/
.tab_wrap ul {display: flex;}
.tab_wrap ul [class^=tab] {padding: 1.5rem 2rem; background: #f9f9f9; display: flex; gap: 1rem;border-radius: 1.5rem 1.5rem 0 0;color:#777;cursor: pointer;transition: .3s; align-items: center; white-space: nowrap; border-bottom: none}
.tab_wrap ul [class^=tab]:hover {color:#000}
.tab_wrap ul [class^=tab].on {background: #fff; color: #000;border-bottom: 3px solid var(--color-primary)}
.tab_wrap ul [class^=tab] .icon {width:20px; height:20px;}
.tab_wrap ul [class^=tab] p {width:calc(100% - 20px - 1rem)} /* 탭에 아이콘 있을 경우 */

[class^=tabitem] {display: none; border-radius: 0 0 1.5rem 1.5rem}
[class^=tabitem].on {display: block; }

/*.tab_wrap ul {overflow: auto; overflow: scroll; overflow-x: scroll; overflow-y: auto; scrollbar-width:none; -ms-overflow-style:none;}*/

/*.blanktab {width:2rem; background-color: #fff;}*/

[class^=tabitem] .button {display: inline-block; margin-top: 5rem; background: var(--color-primary); color:white; font-weight: 600; border-radius: 100px; transition: 0.3s}
[class^=tabitem] .button:hover {background: #000}
[class^=tabitem] .button a {display: flex;gap: 2rem; justify-content: space-between; align-items: center; padding: 1rem 2rem;}
[class^=tabitem] .button .arr {width:1.6rem; height:1.6rem; background: url("../img/btn_arr.png") center / contain no-repeat}

@media screen and (max-width: 1024px) {
	.tab_wrap ul [class^=tab] .icon {width:15px; height:15px}
	.tab_wrap ul [class^=tab] p {width:calc(100% - 15px - 1rem)}
}

@media screen and (max-width: 768px) {
/*	.tab_wrap ul { padding: 0 2rem}*/
	.tab_wrap ul [class^=tab] {font-size: 12px}
	.tab_wrap:before {display: block}
	.tab_wrap:after {display: block}
	.tab_wrap .tab_wrap_inner {margin-left: 0; padding: 0 2rem;}
	.tab_wrap .tab_wrap_inner [class^=tab] .icon {width:15px; height:15px}
	.tab_wrap .tab_wrap_inner [class^=tab] p {width:calc(100% - 15px - 1rem)}
	.tab_wrap .tab_wrap_inner [class^=tab] {font-size: 12px}
	
	[class^=tabitem] .button {font-size: 12px;}
	[class^=tabitem] .button a {padding: 2rem 3rem;}
	[class^=tabitem] .button .arr {width:3rem; height: 3rem;}
}


.cta {display: flex; flex-direction: column; align-items: center;  background: url("../img/CTA_bg.jpg") center / cover; text-align: center; border-radius: 1.5rem; color:#fff;}
.cta a {width:100%; height:100%; padding: 9rem;}
.cta .desc {color:#fff; opacity: .9}
.cta .button { margin: 3rem auto 0; color:var(--color-primary); font-weight: 600; width: fit-content }
.cta .button {padding: 1rem 2rem; display: flex; gap: 2rem; align-items: center; justify-content: center; background: #fff; border-radius: 100px; transition: 0.3s}
.cta a:hover .button  {background: var(--color-primary); color:#fff;}
.cta .button .arr {width:1.6rem; height:1.6rem; background: url("../img/btn_arr_color.png") center / contain no-repeat; transition: 0.3s}
.cta a:hover .button .arr {width:1.6rem; height:1.6rem; background: url("../img/btn_arr.png") center / contain no-repeat}

@media screen and (max-width: 768px) {
	.cta .button {font-size: 12px;}
}


.underconst { text-align: center; margin-bottom: 8rem;}
.underconst .logo { margin-bottom: 7rem;}
@media screen and (max-width: 768px) {
	.underconst .logo img {width:40%}
}



/* ======================= page0101 ======================== */

.page0101 .section01 {text-align: center; width:100%; aspect-ratio: 127 / 60; background: url(../img/sub0101_img01.jpg) no-repeat center/cover;display: flex; align-items: center; justify-content: center}
@media screen and (max-width: 500px) {
	.page0101 .section01 {aspect-ratio: 127 / 80;}
}
@media screen and (max-width: 400px) {
	.page0101 .section01 {aspect-ratio: 127 / 95;}
}

.page0101 .section02 .contents {display: flex; flex-wrap: wrap; gap: 2rem;}
.page0101 .section02 [class^=innerbox] {padding: 3rem; width:calc(50% - 1rem);}
.page0101 .section02 [class^=innerbox] .txt_wrap {margin-bottom: 3rem;}
.page0101 .section02 [class^=innerbox] .sup {display: inline-block; padding: .4rem 1.5rem; border: 1px solid #ddd; color:#555; border-radius: 100px; font-size: 1.6rem; font-weight: 600; background: #eee; margin-bottom: 2rem;}
.page0101 .section02 [class^=innerbox] .subtit {font-size: 2rem; font-weight: 600; margin-bottom: 1rem;}
.page0101 .section02 [class^=innerbox] .desc {color:#333;}
.page0101 .section02 [class^=innerbox] .boxtxt_wrap {display: flex; flex-wrap: wrap; gap: 1rem;}

@media screen and (max-width: 768px) {
	.page0101 .section02 [class^=innerbox] .sup {font-size: 10px}
	.page0101 .section02 [class^=innerbox] .subtit {font-size: 14px;}
	.page0101 .section02 [class^=innerbox] .desc {font-size: 12px;}
}
@media screen and (max-width: 460px) {
	.page0101 .section02 .contents {flex-direction: column;}
	.page0101 .section02 [class^=innerbox] { width:100%;}
}

.page0101 .section03 .contents {display: flex; gap:2rem; flex-wrap: wrap; justify-content: space-between}
.page0101 .section03 [class^=innerbox] { width:32%; transition: 0.3s}
.page0101 .section03 [class^=innerbox] a {width:100%; height:100%;padding: 3rem; display: flex; gap:2rem; }
.page0101 .section03 [class^=innerbox] a .icon {width: 6rem; height: 6rem;}
.page0101 .section03 [class^=innerbox] a .txt_wrap { width:calc(100% - 6rem)}
.page0101 .section03 [class^=innerbox] a .txt_wrap .subtit {display: flex; align-items: center; gap:1rem;transition: 0.3s; }
.page0101 .section03 [class^=innerbox] a .txt_wrap p {font-size: 2rem; font-weight: bold;}
.page0101 .section03 [class^=innerbox] a .txt_wrap span {opacity: 0; width:1.6rem; height:1.6rem; background: url("../img/btn_arr_color.png") center / contain no-repeat; transition: 0.3s}
.page0101 .section03 [class^=innerbox] a .txt_wrap .desc {color:#333;}

.page0101 .section03 [class^=innerbox]:hover {border: 1px solid var(--color-primary); transform: translateY(-5px)}
.page0101 .section03 [class^=innerbox]:hover a .txt_wrap .subtit {}
.page0101 .section03 [class^=innerbox]:hover a .txt_wrap span {margin-left: .5rem;opacity: 1;}

@media screen and (max-width:1024px) {
	.page0101 .section03 [class^=innerbox] a .txt_wrap span {opacity: 1}
}
@media screen and (max-width:768px) {
	.page0101 .section03 [class^=innerbox] a .txt_wrap .subtit {gap:2rem;}
	.page0101 .section03 [class^=innerbox] a .txt_wrap p {width:calc(100% - 1.6rem);font-size: 14px;}
	.page0101 .section03 [class^=innerbox] a .txt_wrap .desc {font-size: 12px}
}
@media screen and (max-width:554px) {
	.page0101 .section03 [class^=innerbox] {width:calc(50% - 1rem)}
}
@media screen and (max-width:420px) {
	.page0101 .section03 [class^=innerbox] {width:100%}
	.page0101 .section03 [class^=innerbox] a .txt_wrap p {width:auto;}
}


.page0101 .section03 .innerbox01 .icon {background: url(../img/sub0101_img0301.png) no-repeat center/contain;}
.page0101 .section03 .innerbox02 .icon {background: url(../img/sub0101_img0302.png) no-repeat center/contain;}
.page0101 .section03 .innerbox03 .icon {background: url(../img/sub0101_img0303.png) no-repeat center/contain;}
.page0101 .section03 .innerbox04 .icon {background: url(../img/sub0101_img0304.png) no-repeat center/contain;}
.page0101 .section03 .innerbox05 .icon {background: url(../img/sub0101_img0305.png) no-repeat center/contain;}
.page0101 .section03 .innerbox06 .icon {background: url(../img/sub0101_img0306.png) no-repeat center/contain;}



.page0101 .section04 .contents {display: flex; flex-direction: column; gap:2rem;}
.page0101 .section04 .contents [class^=item] {display: flex; gap:2rem; align-items: center}
.page0101 .section04 .contents .img {width:30%; aspect-ratio: 42 / 30;}
.page0101 .section04 .contents .txt_wrap {display: flex; flex-direction: column; gap:1rem;width:70%}
.page0101 .section04 .contents .txt_wrap .icon { width:2rem; height:2rem;}
.page0101 .section04 .contents .txt_wrap .subtit {font-weight: 600; font-size: 2rem;}
.page0101 .section04 .contents .txt_wrap .desc {}
.page0101 .section04 .contents .txt_wrap .boxtxt_wrap {margin-top: 1rem; display: flex; gap:1rem; flex-wrap: wrap;}

@media screen and (max-width: 1024px) {
	.page0101 .section04 .contents .img {width: 30%}
}
@media screen and (max-width: 768px) {
	.page0101 .section04 .contents .img {}
	
	.page0101 .section04 .contents .txt_wrap .subtit {font-size: 14px;}
	.page0101 .section04 .contents .txt_wrap .desc {font-size: 12px;}
	.page0101 .section04 .contents .txt_wrap .boxtxt_wrap .boxtxt {font-size: 12px}
}
@media screen and (max-width: 660px) {
	.page0101 .section04 .contents {gap:8rem;}
	.page0101 .section04 .contents .txt_wrap {width:100%}
	.page0101 .section04 .contents [class^=item] {flex-direction: column;}
	.page0101 .section04 .contents .img {width: 100%}
}

.page0101 .section04 .contents .item01 .img {background: url(../img/sub0101_img0401.jpg) no-repeat center/contain;}
.page0101 .section04 .contents .item02 .img {background: url(../img/sub0101_img0402.jpg) no-repeat center/contain;}
.page0101 .section04 .contents .item03 .img {background: url(../img/sub0101_img0403.jpg) no-repeat center/contain;}



.page0101 .section05 .inner_tit_wrap {display: flex; gap: 3rem; align-items: baseline; margin: 5rem 0 2rem}
.page0101 .section05 .inner_tit {font-size: 2.8rem; font-weight: 600}
.page0101 .section05 .inner_tit:before {width:.7rem; height: .7rem;}
.page0101 .section05 .inner_desc {color:#333;}

@media screen and (max-width: 768px) {
	.page0101 .section05 .inner_tit_wrap {flex-direction: column; gap:0;}
	.page0101 .section05 .inner_desc {padding-left: 2rem;}
}

.page0101 .section05 .slider {display: flex; gap: 2rem;}
.page0101 .section05 .slider [class^=item] {padding: 2rem; width: 28rem; min-width: 28rem;}

.page0101 .section05 .logo_wrap {display: grid; grid-template-columns: repeat(5, 1fr); gap:1rem;}
.page0101 .section05 .logo_wrap [class^=item] {padding: 1.5rem;}
.page0101 .section05 .logo_wrap [class^=item] img {width:100%}
@media screen and (max-width: 580px) {
	.page0101 .section05 .logo_wrap {grid-template-columns: repeat(3, 1fr)}
}
@media screen and (max-width: 330px) {
	.page0101 .section05 .logo_wrap {grid-template-columns: repeat(2, 1fr)}
}

/* ======================= page0101 ======================== */




/* ======================= page0103 ======================== */

.page0103 .section01 .contents {}
.page0103 .section01 .contents .top {display: flex; gap:2rem;justify-content: space-between}
.page0103 .section01 .contents .top div {display: flex; flex-direction: column; justify-content: center;align-items: center; gap: 3rem; width:49%; aspect-ratio: 61 / 35; text-align: center}
.page0103 .section01 .contents .top div .tit {font-size: 6rem; font-weight: 800;}
.page0103 .section01 .contents .top div .tit span {color:var(--color-primary)}
.page0103 .section01 .contents .top div .desc {color:#333;}
.page0103 .section01 .contents .bottom {display: flex; flex-direction: column; gap:3rem; justify-content: center; align-items: center; text-align: center; width:100%; aspect-ratio:127 / 34; background: url(../img/sub0103_img01.jpg) no-repeat center/cover; border-radius: 1.5rem; margin-top: 2.2rem;}
.page0103 .section01 .contents .bottom .logo {width:53rem;}
.page0103 .section01 .contents .bottom .desc {color:#fff;}
@media screen and (max-width: 1024px) {
	.page0103 .section01 .contents .top div {aspect-ratio: 61 / 27;}
	.page0103 .section01 .contents .bottom {aspect-ratio:127 / 30;}
}
@media screen and (max-width: 768px) {
	.page0103 .section01 .contents .top div .tit {font-size: 30px;}
	.page0103 .section01 .contents div .desc {font-size: 12px;}
	
	.page0103 .section01 .contents .top div {padding: 6rem 3rem}
	.page0103 .section01 .contents .bottom {padding: 10rem 3rem}
}
@media screen and (max-width: 500px) {
	.page0103 .section01 .contents br {display: block}
	.page0103 .section01 .contents .top {flex-direction: column}
	.page0103 .section01 .contents .top div {width: 100%}
	.page0103 .section01 .contents .bottom .logo {width:80%;}
}
@media screen and (max-width: 455px) {
	.page0103 .section01 .contents .pc2 {display: none}
}

@media screen and (max-width: 350px) {
	.page0103 .section01 .contents br {display: none}
}


.page0103 .section02 .contents {display: flex; gap:2rem; }
.page0103 .section02 .contents [class^=item_] {width:50%; padding: 10rem 3rem; border-radius: 1.5rem; background: var(--color-primary); color:#fff; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 3rem; text-align: center}
.page0103 .section02 .contents [class^=item_] .icon {width:14rem; aspect-ratio: 1 / 1; }
.page0103 .section02 .contents [class^=item_] .txt_wrap {}
.page0103 .section02 .contents [class^=item_] .txt_wrap .sup {font-size: 1.6rem; font-weight: 600;}
.page0103 .section02 .contents [class^=item_] .txt_wrap .subtit {font-size: 3.6rem; font-weight: 600; margin: 1.5rem 0; line-height: 1.2}
.page0103 .section02 .contents [class^=item_] .txt_wrap .desc {opacity: .9}

@media screen and (max-width: 768px) {
	.page0103 .section02 .contents [class^=item_] .txt_wrap .sup {font-size: 10px;}
	.page0103 .section02 .contents [class^=item_] .txt_wrap .subtit {font-size: 22px}
	.page0103 .section02 .contents [class^=item_] .txt_wrap .desc {font-size: 12px}
}
@media screen and (max-width: 600px) {
	.page0103 .section02 .contents {flex-direction: column;}
	.page0103 .section02 .contents [class^=item_] {width:100%;}
}
@media screen and (max-width: 320px) {
	.page0103 .section02 .contents [class^=item_] .txt_wrap br {display: none}
}

.page0103 .section02 .contents .item_left .icon {background: url(../img/sub0103_img0201.png) no-repeat center/contain;}
.page0103 .section02 .contents .item_right .icon {background: url(../img/sub0103_img0202.png) no-repeat center/contain;}

/* ======================= page0103 ======================== */


/* ======================= page0104 ======================== */

/*.page0104 .section01 .contents {display: flex; flex-wrap: wrap; gap:3rem;justify-content: space-between}*/
.page0104 .section01 .contents {display: grid; grid-template-columns: repeat(3, 1fr); gap: 6rem;}
.page0104 .section01 .contents [class^=item] {padding-bottom: 5rem; border-bottom: 1px solid #ddd;}
/*
.page0104 .section01 .contents [class^=item] .pic {width:100%; aspect-ratio: 376 / 456; background: #eee; margin-bottom: 2rem; position: relative; overflow: hidden; border-radius: 1.5rem; border: 1px solid #eee;}
.page0104 .section01 .contents [class^=item] .pic .img {width:100%; height: 100%;}
.page0104 .section01 .contents [class^=item] .pic .img:before {content: ''; position: absolute; top:0; left:0; width:100%; height: 100%; background: linear-gradient(rgba(255, 194, 165, .5) -80%, rgba(255, 255, 255, 0) 100%);}
*/
.page0104 .section01 .contents [class^=item] .pic {width:100%; aspect-ratio: 376 / 456;margin-bottom: 2rem;}
.page0104 .section01 .contents [class^=item] .pic img {width:100%}
.page0104 .section01 .contents [class^=item] .txt_wrap {padding: 0 1rem;}
.page0104 .section01 .contents [class^=item] .txt_wrap .name {font-size: 2.4rem; font-weight: 600; margin-bottom: .5rem;}
.page0104 .section01 .contents [class^=item] .txt_wrap .sub {font-weight: 600; color:#333; margin-bottom: 2rem;}
.page0104 .section01 .contents [class^=item] .txt_wrap .disc:before {background: #bbb}
.page0104 .section01 .contents [class^=item] .txt_wrap li {margin-bottom: .5rem;}
.page0104 .section01 .contents [class^=item] .txt_wrap li:last-child {margin-bottom: 0;}

@media screen and (max-width: 768px) {
	.page0104 .section01 .contents [class^=item] .txt_wrap .name {font-size: 16px;}
	.page0104 .section01 .contents [class^=item] .txt_wrap .sub {font-size: 12px}
	.page0104 .section01 .contents [class^=item] .txt_wrap li {font-size: 12px}
}
@media screen and (max-width: 620px) {
	.page0104 .section01 .contents {grid-template-columns: repeat(2, 1fr);column-gap:3rem; row-gap:10rem;}
}
@media screen and (max-width: 350px) {
	.page0104 .section01 .contents {grid-template-columns: repeat(1, 1fr);}
}

.page0104 .section02 .contents {display: flex; gap: 2rem; justify-content: space-between}
.page0104 .section02 .contents [class^=item] {padding: 3rem; width:32%}
.page0104 .section02 .contents [class^=item] .icon_wrap {width:100%;display: flex; justify-content: end;}
.page0104 .section02 .contents [class^=item] .icon { width: 5rem; aspect-ratio:1 / 1;}
.page0104 .section02 .contents [class^=item] .txt_wrap {}
.page0104 .section02 .contents [class^=item] .txt_wrap .strong_txt {font-size: 7rem; font-weight: 800; display: flex; align-items: baseline; gap: .5rem;}
.page0104 .section02 .contents [class^=item] .txt_wrap .strong_txt span {font-size: 1.8rem;}
.page0104 .section02 .contents [class^=item] .desc {color:#555; margin-top: -1.5rem; font-weight: 600}

@media screen and (max-width: 768px) {
	.page0104 .section02 .contents [class^=item] .txt_wrap .strong_txt {font-size: 34px;}
	.page0104 .section02 .contents [class^=item] .txt_wrap .strong_txt span {font-size: 12px}
	.page0104 .section02 .contents [class^=item] .desc {font-size: 12px}
}
@media screen and (max-width: 500px) {
	.page0104 .section02 .contents {flex-direction: column}
	.page0104 .section02 .contents [class^=item] {width:100%}
}

.page0104 .section02 .contents .item01 .icon {background: url(../img/sub0104_img0201.png) no-repeat center/contain;}
.page0104 .section02 .contents .item02 .icon {background: url(../img/sub0104_img0202.png) no-repeat center/contain;}
.page0104 .section02 .contents .item03 .icon {background: url(../img/sub0104_img0203.png) no-repeat center/contain;}

/* ======================= page0104 ======================== */


/* ======================= page0105 ======================== */

.page0105 .section01 .contents {}
.page0105 .section01 .map {width:100%; height: 63rem; margin-bottom: 4rem; background: url(../img/sub0105_map.jpg) no-repeat center/cover;}
.page0105 .section01 {} 
.page0105 .section01 .subtit { display: flex; gap:2rem;align-items: center}
.page0105 .section01 .subtit .icon {width:4rem; aspect-ratio:1 / 1; }
.page0105 .section01 .subtit p {font-size: 2.4rem; font-weight: 600;}
.page0105 .section01 .table_wrap {margin-top: 2rem}
.page0105 .section01 table {font-size: 1.8rem; color:#333;text-align: left}
.page0105 .section01 table tbody {border-top: 1px solid #333;}
.page0105 .section01 table tr {border-bottom: 1px solid #ddd;}
.page0105 .section01 table th {font-weight: 600; padding: 2rem; width:170px}
.page0105 .section01 table td {gap: 2rem;  padding: 2rem; padding-left: 0}
.page0105 .section01 table td span {display:inline-block; padding: .1rem 1rem; border: 1px solid #ddd; border-radius: 100px; background: #f9f9f9; color: #999; cursor: pointer; font-size: 1.6rem; font-weight: bold; }
.page0105 .section01 .bottom {display: flex; gap:4rem;margin-top: 4rem;}
.page0105 .section01 .bottom .subway {width:50%}
.page0105 .section01 .bottom .park {width:50%}

@media screen and (max-width: 1024px) {
	.page0105 .section01 table th {width:105px}
}

@media screen and (max-width: 768px) {
	.page0105 .section01 .subtit p {font-size: 16px;}
	.page0105 .section01 table {font-size: 12px;}
	.page0105 .section01 table th {width:110px}
	
	
}
@media screen and (max-width: 660px) {
	.page0105 .section01 .subtit .icon {width:30px;}
	.page0105 .section01 .bottom {flex-direction: column;}
	.page0105 .section01 .bottom .subway {width:100%}
	.page0105 .section01 .bottom .park {width:100%}
}



.page0105 .section01 .office .subtit .icon {background: url(../img/sub0105_icon0101.png) no-repeat center/contain;}
.page0105 .section01 .subway .subtit .icon {background: url(../img/sub0105_icon0102.png) no-repeat center/contain;}
.page0105 .section01 .park .subtit .icon {background: url(../img/sub0105_icon0103.png) no-repeat center/contain;}

/* ======================= page0105 ======================== */





/* ======================= page02 ======================== */
.page02 .section01 .contents {display: flex; justify-content: space-between; gap: 1rem}
.page02 .section01 .contents .left {width:50%; padding: 5rem 3rem 3rem 3rem; display: flex; flex-direction: column; gap:2rem;}
.page02 .section01 .contents .title {text-align: center; font-weight: 600; font-size: 2.8rem}
.page02 .section01 .contents .left [class^=box0] {background: #fff; border-radius: 1rem; padding: 3rem 2rem}
.page02 .section01 .contents .left .box_tit {}
.page02 .section01 .contents .left .box_tit span{display: block; font-size: 2.2rem; font-weight: 600;padding: 0 1rem}
.page02 .section01 .contents .left .box_tit:after {content: ''; display: block; width:100%; height: 1px; background: #ddd;margin: 1.5rem 0 2rem}
.page02 .section01 .contents .left [class^=sub] {padding:0 1rem; margin-bottom: 2rem;}
.page02 .section01 .contents .left [class^=sub]:last-child {margin-bottom: 0;}
.page02 .section01 .contents .left [class^=sub] .tit {font-weight: 600; color:#333; font-size: 2rem; }
.page02 .section01 .contents .left [class^=sub] .tit:before {background: #bbb; }
.page02 .section01 .contents .left [class^=sub] p {color:#333; padding-left: 1.5rem}

.page02 .section01 .contents .arr {width: 3rem; background: url("../img/arr.png") center / contain no-repeat}

.page02 .section01 .contents .right {width:50%; padding: 5rem 3rem 3rem 3rem; display: flex; justify-content: space-between;flex-direction: column;}
.page02 .section01 .contents .right .title:after {content: ''; display: block; width:100%; height:1px; background: #ddd; margin: 3rem 0;}
.page02 .section01 .contents .right .sub_wrap {display: flex; flex-direction: column; gap: 2rem; margin-bottom: 3rem;padding: 0 0 0 1rem}
.page02 .section01 .contents .right .sub_wrap .tit {font-size: 2.2rem; font-weight: 600;}
.page02 .section01 .contents .right .sub_wrap p {color:#333; padding-left: 2rem}
.page02 .section01 .contents .right .img {text-align: center}

@media screen and (max-width: 768px){
	.page02 .section01 .contents .title {font-size: 18px}
	.page02 .section01 .contents .left .box_tit span {font-size: 16px}
	.page02 .section01 .contents .left [class^=sub] .tit {font-size: 12px}
	.page02 .section01 .contents .right .sub_wrap .tit {font-size: 16px}
	.page02 .section01 .contents .left [class^=sub] p {font-size: 12px}
	.page02 .section01 .contents .right .sub_wrap p {font-size: 12px}
}
@media screen and (max-width: 600px) {
	.page02 .section01 .contents {flex-direction: column;gap: 10px}
	.page02 .section01 .contents .left, .page02 .section01 .contents .right {width:100%; padding: 4rem 3rem 3rem 3rem}
	.page02 .section01 .contents .arr {width: auto; height: 3rem; background: url("../img/arr_d.png") center / contain no-repeat}
	.page02 .section01 .contents .right .img img{width:auto}
}

.page02 .section02 .contents .slider [class^=item] {width:36rem; min-width: 36rem; padding: 3rem 4rem 6rem; display: flex; flex-direction: column; gap: 2rem; text-align: center;}
.page02 .section02 .contents .slider [class^=item] .img {width:100%; aspect-ratio : 1 / 1;}
.page02 .section02 .contents .slider [class^=item] .txt_wrap {display: flex; flex-direction: column; align-items: center; gap:1rem;}
.page02 .section02 .contents .slider [class^=item] .txt_wrap {}
.page02 .section02 .contents .slider [class^=item] .txt_wrap .num {width:2.2rem; height:2.2rem; background: var(--color-primary); border-radius: 100px; color:#fff; line-height: 2.2rem; font-weight: 600;font-size: 1.6rem}
.page02 .section02 .contents .slider [class^=item] .txt_wrap .tit {font-size: 2.2rem; font-weight: 600}
.page02 .section02 .contents .slider [class^=item] .txt_wrap .p {color: #333}


@media screen and (max-width: 768px) {
	.page02 .section02 .title br.pc {display: block}
	.page02 .section02 .contents .slider [class^=item] {width: 235px; padding: 2rem 4rem 6rem; min-width: 50rem;}
	.page02 .section02 .contents .slider [class^=item] .txt_wrap .num {width:18px; height:18px; font-size: 12px; line-height: 18px}
	.page02 .section02 .contents .slider [class^=item] .txt_wrap .tit {font-size: 16px}
	.page02 .section02 .contents .slider [class^=item] .txt_wrap .p {font-size: 12px}
}




.page02 .section03 .linebox {padding: 6rem 1rem 0;text-align: center;display: flex; justify-content: space-around}
@media screen and (max-width: 500px) {.page02 .section03 .linebox {padding:0; padding-top: 4rem; border:none; border-radius: 0; border-bottom: 1px solid #ddd;}}



.page02 .section04 [class^=tabitem] {align-items: center; gap: 3.5rem; padding: 3.5rem;}
.page02 .section04 [class^=tabitem].on {display: flex; }
.page02 .section04 [class^=tabitem] .img {width:65%; aspect-ratio: 1 / .56; border-radius: 1rem}
.page02 .section04 [class^=tabitem] .txt_wrap {width:40%;}
.page02 .section04 [class^=tabitem] .txt_wrap .tit_wrap {margin-bottom: 2rem}
.page02 .section04 [class^=tabitem] .txt_wrap .tit_wrap .tit {font-weight: 600; font-size: 2.2rem; margin-bottom: .8rem}
.page02 .section04 [class^=tabitem] .txt_wrap .tit_wrap .desc {color:#333;}
.page02 .section04 [class^=tabitem] .txt_wrap .sub_wrap {display: flex; flex-direction: column; gap:1rem;}
.page02 .section04 [class^=tabitem] .txt_wrap .sub_wrap [class^=sub] p {font-weight: 600; margin-bottom: .2rem}
.page02 .section04 [class^=tabitem] .txt_wrap .sub_wrap [class^=sub] span {display: block; font-size: 1.6rem; color:#333; padding-left: 1.5rem}

@media screen and (max-width: 768px) {
	.page02 .section04 [class^=tabitem] {flex-direction: column;}
	.page02 .section04 [class^=tabitem] .img {width:100%;}
	.page02 .section04 [class^=tabitem] .txt_wrap {width:100%;}
	
	
	.page02 .section04 [class^=tabitem] .txt_wrap .tit_wrap .tit {font-size: 16px}
	.page02 .section04 [class^=tabitem] .txt_wrap .tit_wrap .desc {font-size: 12px}
	.page02 .section04 [class^=tabitem] .txt_wrap .sub_wrap [class^=sub] p {font-size: 12px}
	.page02 .section04 [class^=tabitem] .txt_wrap .sub_wrap [class^=sub] span {font-size: 12px}
}


.page02 .section05 .contents {display: flex; flex-direction: column; gap:2rem;}
.page02 .section05 [class^=box_wrap] {padding: 2.5rem 2rem 2rem}
.page02 .section05 [class^=box_wrap] .tit {font-weight: 600; font-size: 2.8rem; margin-bottom: 2rem}
.page02 .section05 [class^=box_wrap] .inner_wrap {display: flex; gap: 2rem;}
.page02 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] {width:100%; background: #fff;border-radius: 1rem;padding:4rem; display: flex; flex-direction: column;justify-content: space-between; gap:4rem}
.page02 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] .icon{width: 6rem ;height:6rem;}
.page02 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] .txt_wrap{}
.page02 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] .txt_wrap .subtit{font-size: 2rem; font-weight: 600; margin-bottom: 1rem}
.page02 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] .txt_wrap .desc {color:#333}

@media screen and (max-width: 768px) {
	.page02 .section05 [class^=box_wrap] .tit {font-size: 18px}
	.page02 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] .txt_wrap .subtit {font-size:14px }
	.page02 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] .txt_wrap .desc {font-size: 12px}
	
	.page02 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] .icon{width:40px; height:40px}
}
@media screen and (max-width: 660px) {
	.page02 .section05 [class^=box_wrap] .inner_wrap {flex-direction: column}
	.page02 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] {width:100%; }
}




.page02 .section06 [class^=tabitem] {align-items: center; gap: 3.5rem; padding: 3.5rem;}
.page02 .section06 [class^=tabitem].on {display: flex; }
.page02 .section06 [class^=tabitem] .txt_wrap {width:50%;}
.page02 .section06 [class^=tabitem] .txt_inner {}
.page02 .section06 [class^=tabitem] .txt_inner .tit_wrap {margin-bottom: 2rem}
.page02 .section06 [class^=tabitem] .txt_inner .tit_wrap .tit {font-weight: 600; font-size: 2.8rem; margin-bottom: .8rem}
.page02 .section06 [class^=tabitem] .txt_inner .tit_wrap .desc {color:#333;}
.page02 .section06 [class^=tabitem] .txt_inner .sub_wrap {display: flex; flex-direction: column; gap:.2rem;margin-bottom: 2rem}
.page02 .section06 [class^=tabitem] .txt_inner .sub_wrap [class^=sub] p {font-size: 2rem; font-weight: 600; margin-bottom: .2rem}
.page02 .section06 [class^=tabitem] .txt_inner .sub_wrap [class^=sub] span {color: var(--color-primary)}
.page02 .section06 [class^=tabitem] .txt_inner .boxtxt_wrap {display: flex; flex-wrap: wrap; gap:1rem;}

.page02 .section06 [class^=tabitem] .img {width:50%; aspect-ratio: 1 / .7; border-radius: 1rem;}

.page02 .section06 .tab_wrap ul [class^=tab] p {width:auto} /* 탭에 아이콘 없을 경우 */

@media screen and (max-width: 768px) {
	.page02 .section06 [class^=tabitem]{flex-direction: column; flex-flow: column-reverse}
	.page02 .section06 [class^=tabitem] .img {width:100%;}
	.page02 .section06 [class^=tabitem] .txt_wrap {width:100%;}
	
	.page02 .section06 [class^=tabitem] .txt_inner .tit_wrap .tit {font-size: 18px}
	.page02 .section06 [class^=tabitem] .txt_inner .tit_wrap .desc {font-size: 12px}
	.page02 .section06 [class^=tabitem] .txt_inner .sub_wrap [class^=sub] p {font-size: 12px}
	.page02 .section06 [class^=tabitem] .boxtxt_wrap [class^=boxtxt] {font-size: 12px}
}

/* ======================= page02 ======================== */



/* ======================= page0201 ======================== */

/* section01 — 우측 4항목 2×2 그리드 (자매 0202: 3항목 세로) */
.page0201 .section01 .contents .right .sub_wrap {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem 3rem;}
@media screen and (max-width: 1024px) {.page0201 .section01 .contents .right .img img {width:46rem}}
@media screen and (max-width: 600px) {
	.page0201 .section01 .contents .right .sub_wrap {grid-template-columns: repeat(1, 1fr); gap: 2rem;}
	.page0201 .section01 .contents .right .img img {width:auto}
}

.page0201 .section02 .contents .slider .item01 .img { background: url(../img/sub0201_img0201.webp) no-repeat center/contain;}
.page0201 .section02 .contents .slider .item02 .img { background: url(../img/sub0201_img0202.webp) no-repeat center/contain;}
.page0201 .section02 .contents .slider .item03 .img { background: url(../img/sub0201_img0203.webp) no-repeat center/contain;}
.page0201 .section02 .contents .slider .item04 .img { background: url(../img/sub0201_img0204.webp) no-repeat center/contain;}
.page0201 .section02 .contents .slider .item05 .img { background: url(../img/sub0201_img0205.webp) no-repeat center/contain;}

@media screen and (max-width: 768px) {
	.page0201 .section03 .pc {display:block;}
	.page0201 .section03 .mo {display:none;}
}
@media screen and (max-width: 500px) {
	.page0201 .section03 .pc {display:none;}
	.page0201 .section03 .mo {display:block;}
}

.page0201 .section04 .tab01 .icon {background: url(../img/sub0201_icon01.png) no-repeat center/contain;}
.page0201 .section04 .tab02 .icon {background: url(../img/sub0201_icon02.png) no-repeat center/contain;}
.page0201 .section04 .tab03 .icon {background: url(../img/sub0201_icon03.png) no-repeat center/contain;}

.page0201 .section04 .tab01.on .icon {background: url(../img/sub0201_icon01_on.png) no-repeat center/contain;}
.page0201 .section04 .tab02.on .icon {background: url(../img/sub0201_icon02_on.png) no-repeat center/contain;}
.page0201 .section04 .tab03.on .icon {background: url(../img/sub0201_icon03_on.png) no-repeat center/contain;}

.page0201 .section04 .tabitem01 .img {background: url(../img/sub0201_img0401.jpg) no-repeat center/contain;}
.page0201 .section04 .tabitem02 .img {background: url(../img/sub0201_img0402.jpg) no-repeat center/contain;}
.page0201 .section04 .tabitem03 .img {background: url(../img/sub0201_img0403.jpg) no-repeat center/contain;}

/* section05 — 그룹박스 3개(자매 2개) + Proof Badge(그룹1 카드 1·2, CSS 구현) */
/* 카드 상단 정렬 + 배지 하단 정렬: 배지 유무·본문 길이가 달라도 배지끼리 같은 높이에 놓인다 */
.page0201 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] {justify-content: flex-start;}
.page0201 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] .txt_wrap {display: flex; flex-direction: column; flex-grow: 1;}
.page0201 .section05 .badge_wrap {margin-top: auto; padding-top: 2rem;}
.page0201 .section05 .badge {display: inline-block; padding: .3rem 1.2rem; font-size: 1.4rem; font-weight: 600; color: var(--color-primary); background: #fff1eb; border: 1px solid #ffd3bf; border-radius: 100px;}

@media screen and (max-width: 768px) {
	.page0201 .section05 .badge {font-size: 12px}
}

.page0201 .section05 .innerbox01 .icon {background: url(../img/sub0201_img0501.png) no-repeat center/contain;}
.page0201 .section05 .innerbox02 .icon {background: url(../img/sub0201_img0502.png) no-repeat center/contain;}
.page0201 .section05 .innerbox03 .icon {background: url(../img/sub0201_img0503.png) no-repeat center/contain;}
.page0201 .section05 .innerbox04 .icon {background: url(../img/sub0201_img0504.png) no-repeat center/contain;}
.page0201 .section05 .innerbox05 .icon {background: url(../img/sub0201_img0505.png) no-repeat center/contain;}
.page0201 .section05 .innerbox06 .icon {background: url(../img/sub0201_img0506.png) no-repeat center/contain;}
.page0201 .section05 .innerbox07 .icon {background: url(../img/sub0201_img0507.png) no-repeat center/contain;}
.page0201 .section05 .innerbox08 .icon {background: url(../img/sub0201_img0508.png) no-repeat center/contain;}
.page0201 .section05 .innerbox09 .icon {background: url(../img/sub0201_img0509.png) no-repeat center/contain;}

/* section06 — 탭 없는 단일 카드(자매: 탭 3) */
.page0201 .section06 .tabitem01 .img {background: url(../img/sub0201_img0601.jpg) no-repeat center/contain;}

/* ======================= page0201 ======================== */

/* section03 - schematic lower illustration (B: separated asset, visually matches integrated sisters) */
.page02.page0201 .section03 .linebox { flex-direction: column; align-items: center; height: auto; }
.page02.page0201 .section03 .linebox .illust { display: block; width: 100%; max-width: 1200px; height: auto; margin: 40px auto 0; }
@media (max-width: 500px) { .page02.page0201 .section03 .linebox .illust { margin-top: 24px; } }

/* section03 - 2x retina schematic assets displayed at 1x layout size */
/* height:auto - width/height 속성(공간 예약)과 유동 폭 CSS가 함께 있을 때 비율 왜곡 방지 */
.page02.page0201 .section03 img.pc { width: 100%; max-width: 1200px; height: auto; }
.page02.page0201 .section03 img.mo { width: 100%; max-width: 650px; height: auto; }

/* section01 - 우측 일러도 동일: 미디어쿼리 width 오버라이드 시 비율 유지 */
.page0201 .section01 .contents .right .img img { height: auto; }

/* section06 - two CTA buttons: side by side on PC, stacked on mobile */
.page02.page0201 .section06 .button + .button { margin-left: 1.5rem; }
@media screen and (max-width: 768px) {
	.page02.page0201 .section06 .button { display: block; width: fit-content; }
	.page02.page0201 .section06 .button + .button { margin-left: 0; margin-top: 2.4rem; }
}

/* section04 - keyboard focus indicator for operation tabs */
.page02.page0201 .section04 .tab_wrap ul li[role="tab"]:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.page02.page0201 .section04 .tab_wrap ul li[role="tab"]:focus:not(:focus-visible) { outline: none; }


/* DrawAX English QC: feature hierarchy and Register text width */
html[lang="en"] .page0201 .section01 .contents .right {padding-inline:2rem;}
html[lang="en"] .page0201 .section01 .contents .right .sub_wrap {padding-left:0; column-gap:2rem;}
html[lang="en"] .page0201 .section01 .contents .right .sub_wrap .tit {font-size:2rem; font-weight:700; line-height:1.35; margin-bottom:.8rem;}
html[lang="en"] .page0201 .section01 .contents .right .sub_wrap p {padding-left:1.5rem; font-size:1.8rem; line-height:1.55; color:#555;}
html[lang="en"] .page0201 .section02 .contents .slider .item01 .txt_wrap {width:calc(100% + 4rem); margin-inline:-2rem;}
@media screen and (min-width:769px) {
    html[lang="en"] .page0201 .section01 .contents .right .sub_wrap {grid-template-columns:minmax(0, 1.05fr) minmax(0, .95fr);}
}
@media screen and (max-width:768px) {
    html[lang="en"] .page0201 .section01 .contents .right .sub_wrap .tit {font-size:16px; margin-bottom:6px;}
    html[lang="en"] .page0201 .section01 .contents .right .sub_wrap p {font-size:12px;}
}

/* ======================= page0202 ======================== */

@media screen and (max-width: 1024px) {.page0202 .section01 .contents .right .img img {width:46rem}}
@media screen and (max-width: 600px) {.page0202 .section01 .contents .right .img img {width:auto}}


.page0202 .section02 .contents .slider .item01 .img { background: url(../img/sub0202_img0201.png) no-repeat center/contain;}
.page0202 .section02 .contents .slider .item02 .img { background: url(../img/sub0202_img0202.png) no-repeat center/contain;}
.page0202 .section02 .contents .slider .item03 .img { background: url(../img/sub0202_img0203.png) no-repeat center/contain;}
.page0202 .section02 .contents .slider .item04 .img { background: url(../img/sub0202_img0204.png) no-repeat center/contain;}
.page0202 .section02 .contents .slider .item05 .img { background: url(../img/sub0202_img0205.png) no-repeat center/contain;}
@media screen and (max-width: 480px) {.page0202 .section02 .title br.pc {display: none}}

@media screen and (max-width: 768px) {
	.page0202 .section03 .pc {display:block;}
	.page0202 .section03 .mo {display:none;}
}
@media screen and (max-width: 500px) {
	.page0202 .section03 .pc {display:none;}
	.page0202 .section03 .mo {display:block;}	
}

/*.page0202 .section05 [class^=box_wrap] .inner_wrap [class^=innerbox] {width:100%}*/


.page0202 .section04 .tab01 .icon {background: url(../img/sub0202_icon01.png) no-repeat center/contain;}
.page0202 .section04 .tab02 .icon {background: url(../img/sub0202_icon02.png) no-repeat center/contain;}
.page0202 .section04 .tab03 .icon {background: url(../img/sub0202_icon03.png) no-repeat center/contain;}
.page0202 .section04 .tab04 .icon {background: url(../img/sub0202_icon04.png) no-repeat center/contain;}

.page0202 .section04 .tab01.on .icon {background: url(../img/sub0202_icon01_on.png) no-repeat center/contain;}
.page0202 .section04 .tab02.on .icon {background: url(../img/sub0202_icon02_on.png) no-repeat center/contain;}
.page0202 .section04 .tab03.on .icon {background: url(../img/sub0202_icon03_on.png) no-repeat center/contain;}
.page0202 .section04 .tab04.on .icon {background: url(../img/sub0202_icon04_on.png) no-repeat center/contain;}

.page0202 .section04 .tabitem01 .img {background: url(../img/sub0202_img0401.jpg) no-repeat center/contain;}
.page0202 .section04 .tabitem02 .img {background: url(../img/sub0202_img0402.jpg) no-repeat center/contain;}
.page0202 .section04 .tabitem03 .img {background: url(../img/sub0202_img0403.jpg) no-repeat center/contain;}
.page0202 .section04 .tabitem04 .img {background: url(../img/sub0202_img0404.jpg) no-repeat center/contain;}


.page0202 .section05 .innerbox01 .icon {background: url(../img/sub0202_img0501.png) no-repeat center/contain;}
.page0202 .section05 .innerbox02 .icon {background: url(../img/sub0202_img0502.png) no-repeat center/contain;}
.page0202 .section05 .innerbox03 .icon {background: url(../img/sub0202_img0503.png) no-repeat center/contain;}
.page0202 .section05 .innerbox04 .icon {background: url(../img/sub0202_img0504.png) no-repeat center/contain;}
.page0202 .section05 .innerbox05 .icon {background: url(../img/sub0202_img0505.png) no-repeat center/contain;}
.page0202 .section05 .innerbox06 .icon {background: url(../img/sub0202_img0506.png) no-repeat center/contain;}

.page0202 .section06 .tabitem01 .img {background: url(../img/sub0202_img0601.jpg) no-repeat center/contain;}
.page0202 .section06 .tabitem02 .img {background: url(../img/sub0202_img0602.jpg) no-repeat center/contain;}
.page0202 .section06 .tabitem03 .img {background: url(../img/sub0202_img0603.jpg) no-repeat center/contain;}

/* ======================= page0202 ======================== */


/* ======================= page0203 ======================== */

.page0203 .section01 .contents .right .img img {width:36rem}
@media screen and (max-width: 1560px) {.page0203 .section01 .contents .right .img img {width:25rem}}
@media screen and (max-width: 1240px) {.page0203 .section01 .contents .right .img img {width:36rem}}
@media screen and (max-width: 600px) {.page0203 .section01 .contents .right .img img {width:88rem}}

.page0203 .section02 .contents .slider .item01 .img { background: url(../img/sub0203_img0201.png) no-repeat center/contain;}
.page0203 .section02 .contents .slider .item02 .img { background: url(../img/sub0203_img0202.png) no-repeat center/contain;}
.page0203 .section02 .contents .slider .item03 .img { background: url(../img/sub0203_img0203.png) no-repeat center/contain;}
.page0203 .section02 .contents .slider .item04 .img { background: url(../img/sub0203_img0204.png) no-repeat center/contain;}

.page0203 .section04 .tab01 .icon {background: url(../img/sub0202_icon01.png) no-repeat center/contain;}
.page0203 .section04 .tab02 .icon {background: url(../img/sub0202_icon02.png) no-repeat center/contain;}
.page0203 .section04 .tab03 .icon {background: url(../img/sub0202_icon03.png) no-repeat center/contain;}
.page0203 .section04 .tab04 .icon {background: url(../img/sub0202_icon04.png) no-repeat center/contain;}

.page0203 .section04 .tab01.on .icon {background: url(../img/sub0202_icon01_on.png) no-repeat center/contain;}
.page0203 .section04 .tab02.on .icon {background: url(../img/sub0202_icon02_on.png) no-repeat center/contain;}
.page0203 .section04 .tab03.on .icon {background: url(../img/sub0202_icon03_on.png) no-repeat center/contain;}
.page0203 .section04 .tab04.on .icon {background: url(../img/sub0202_icon04_on.png) no-repeat center/contain;}

.page0203 .section04 .tabitem01 .img {background: url(../img/sub0203_img0401.jpg) no-repeat center/contain;}
.page0203 .section04 .tabitem02 .img {background: url(../img/sub0203_img0402.jpg) no-repeat center/contain;}
.page0203 .section04 .tabitem03 .img {background: url(../img/sub0203_img0403.jpg) no-repeat center/contain;}
.page0203 .section04 .tabitem04 .img {background: url(../img/sub0203_img0404.jpg) no-repeat center/contain;}

.page0203 .section05 .contents {flex-direction: row; flex-wrap: wrap; gap:2rem}
.page0203 .section05 [class^=innerbox] {width:calc(50% - 1rem)}
.page0203 .section05 [class^=innerbox] {border-radius: 1.5rem;padding:4rem; display: flex; flex-direction: column;justify-content: space-between; gap:4rem}
.page0203 .section05 [class^=innerbox] .icon{width: 6rem ;height:6rem;}
.page0203 .section05 [class^=innerbox] .txt_wrap{}
.page0203 .section05 [class^=innerbox] .txt_wrap .subtit{font-size: 2rem; font-weight: 600; margin-bottom: 1rem}
.page0203 .section05 [class^=innerbox] .txt_wrap .desc {color:#333}

@media screen and (max-width: 768px) {
	.page0203 .section05 [class^=innerbox] .txt_wrap .subtit {font-size:14px }
	.page0203 .section05 [class^=innerbox] .txt_wrap .desc {font-size: 12px}
	
	.page0203 .section05 [class^=innerbox] .icon{width:40px; height:40px}
}
@media screen and (max-width: 500px) {
	.page0203 .section05 .contents {flex-direction: column;}
	.page0203 .section05 [class^=innerbox] {width:100%}
}

.page0203 .section05 .innerbox01 .icon {background: url(../img/sub0203_img0501.png) no-repeat center/contain;}
.page0203 .section05 .innerbox02 .icon {background: url(../img/sub0203_img0502.png) no-repeat center/contain;}
.page0203 .section05 .innerbox03 .icon {background: url(../img/sub0203_img0503.png) no-repeat center/contain;}
.page0203 .section05 .innerbox04 .icon {background: url(../img/sub0203_img0504.png) no-repeat center/contain;}


.page0203 .section06 .tabitem01 .img {background: url(../img/sub0203_img0601.jpg) no-repeat center/contain;}
.page0203 .section06 .tabitem02 .img {background: url(../img/sub0203_img0602.jpg) no-repeat center/contain;}
.page0203 .section06 .tabitem03 .img {background: url(../img/sub0203_img0603.jpg) no-repeat center/contain;}
.page0203 .section06 .tabitem04 .img {background: url(../img/sub0203_img0604.jpg) no-repeat center/contain;}

/* ======================= page0203 ======================== */


/* ======================= page0204 ======================== */
.page0204 .section01 .contents .right .img img {width:33rem}
@media screen and (max-width: 1560px) {.page0204 .section01 .contents .right .img img {width:28rem}}
@media screen and (max-width: 1240px) {.page0204 .section01 .contents .right .img img {width:28rem}}
@media screen and (max-width: 600px) {.page0204 .section01 .contents .right .img img {width:66rem}}

.page0204 .section02 .contents .slider .item01 .img { background: url(../img/sub0204_img0201.png) no-repeat center/contain;}
.page0204 .section02 .contents .slider .item02 .img { background: url(../img/sub0204_img0202.png) no-repeat center/contain;}
.page0204 .section02 .contents .slider .item03 .img { background: url(../img/sub0204_img0203.png) no-repeat center/contain;}
.page0204 .section02 .contents .slider .item04 .img { background: url(../img/sub0204_img0204.png) no-repeat center/contain;}

.page0204 .section04 .tab01 .icon {background: url(../img/sub0204_icon01.png) no-repeat center/contain;}
.page0204 .section04 .tab02 .icon {background: url(../img/sub0204_icon02.png) no-repeat center/contain;}
.page0204 .section04 .tab03 .icon {background: url(../img/sub0204_icon03.png) no-repeat center/contain;}

.page0204 .section04 .tab01.on .icon {background: url(../img/sub0204_icon01_on.png) no-repeat center/contain;}
.page0204 .section04 .tab02.on .icon {background: url(../img/sub0204_icon02_on.png) no-repeat center/contain;}
.page0204 .section04 .tab03.on .icon {background: url(../img/sub0204_icon03_on.png) no-repeat center/contain;}

.page0204 .section04 .tabitem01 .img {background: url(../img/sub0204_img0401.jpg) no-repeat center/contain;}
.page0204 .section04 .tabitem02 .img {background: url(../img/sub0204_img0402.jpg) no-repeat center/contain;}
.page0204 .section04 .tabitem03 .img {background: url(../img/sub0204_img0403.jpg) no-repeat center/contain;}

.page0204 .section05 .innerbox01 .icon {background: url(../img/sub0204_img0501.png) no-repeat center/contain;}
.page0204 .section05 .innerbox02 .icon {background: url(../img/sub0204_img0502.png) no-repeat center/contain;}
.page0204 .section05 .innerbox03 .icon {background: url(../img/sub0204_img0503.png) no-repeat center/contain;}
.page0204 .section05 .innerbox04 .icon {background: url(../img/sub0204_img0504.png) no-repeat center/contain;}
.page0204 .section05 .innerbox05 .icon {background: url(../img/sub0204_img0505.png) no-repeat center/contain;}
.page0204 .section05 .innerbox06 .icon {background: url(../img/sub0204_img0506.png) no-repeat center/contain;}

.page0204 .section06 .tabitem01 .img {background: url(../img/sub0204_img0601.jpg) no-repeat center/contain;}
.page0204 .section06 .tabitem02 .img {background: url(../img/sub0204_img0602.jpg) no-repeat center/contain;}
.page0204 .section06 .tabitem03 .img {background: url(../img/sub0204_img0603.jpg) no-repeat center/contain;}
.page0204 .section06 .tabitem04 .img {background: url(../img/sub0204_img0604.jpg) no-repeat center/contain;}


/* ======================= page0204 ======================== */





/* ======================== page03 ========================= */

.page03 .section02 .contents .upperbox {display: flex; gap:2rem; flex-wrap: wrap; padding: 2rem; margin-bottom: 2rem;}
.page03 .section02 .contents .bottombox {padding:2rem; background: #333;}
.page03 .section02 [class^=innerbox] {width:calc(50% - 1rem); background: #fff;}
.page03 .section02 [class^=innerbox] {border-radius: 1.5rem;padding:4rem; display: flex; flex-direction: column;justify-content: space-between; gap:4rem}
.page03 .section02 [class^=innerbox] .icon{width: 6rem ;height:6rem;}
.page03 .section02 [class^=innerbox] .txt_wrap{}
.page03 .section02 [class^=innerbox] .txt_wrap .subtit{font-size: 2rem; font-weight: 600; margin-bottom: 1rem}
.page03 .section02 [class^=innerbox] .txt_wrap .desc {color:#333}

@media screen and (max-width: 768px) {
	.page03 .section02 [class^=innerbox] .txt_wrap .subtit {font-size:14px }
	.page03 .section02 [class^=innerbox] .txt_wrap .desc {font-size: 12px}
	
	.page03 .section02 [class^=innerbox] .icon{width:40px; height:40px}
}
@media screen and (max-width: 500px) {
	.page03 .section02 .contents {flex-direction: column;}
	.page03 .section02 [class^=innerbox] {width:100%}
}

.page03 .section03 .contents {display: flex; flex-direction: column; gap:2rem;}
.page03 .section03 .contents [class^=item] {display: flex; gap:2rem; align-items: center}
.page03 .section03 .contents .img {width:30%; aspect-ratio: 42 / 30;}
.page03 .section03 .contents .txt_wrap {display: flex; flex-direction: column; gap:1rem;width:70%}
.page03 .section03 .contents .txt_wrap .icon { width:2rem; height:2rem;}
.page03 .section03 .contents .txt_wrap .subtit {font-weight: 600; font-size: 2rem;}
.page03 .section03 .contents .txt_wrap .desc {}
.page03 .section03 .contents .txt_wrap .boxtxt_wrap {margin-top: 1rem; display: flex; gap:1rem; flex-wrap: wrap;}

@media screen and (max-width: 1024px) {
	.page03 .section03 .contents .img {width: 30%}
}
@media screen and (max-width: 768px) {
	.page03 .section03 .contents .img {}
	
	.page03 .section03 .contents .txt_wrap .subtit {font-size: 14px;}
	.page03 .section03 .contents .txt_wrap .desc {font-size: 12px;}
	.page03 .section03 .contents .txt_wrap .boxtxt_wrap .boxtxt {font-size: 12px}
}
@media screen and (max-width: 660px) {
	.page03 .section03 .contents {gap:8rem;}
	.page03 .section03 .contents .txt_wrap {width:100%}
	.page03 .section03 .contents [class^=item] {flex-direction: column;}
	.page03 .section03 .contents .img {width: 100%}
}

.page03 .section04 .contents [class^=item] {display: flex; flex-direction: column; padding: 4rem; gap:1rem; min-width: 57rem;  }
.page03 .section04 .contents [class^=item] .subtit { font-weight: bold; font-size: 2rem;}
.page03 .section04 .contents [class^=item] .img {margin: 1rem 0 3rem}
.page03 .section04 .contents [class^=item] .boxtxt_wrap {display: flex; gap:1rem; flex-wrap: wrap; justify-content: end;}
.page03 .section04 .slider {gap:2rem;}

@media screen and (max-width: 768px) {
	.page03 .section04 .contents [class^=item] .subtit {font-size: 14px;}
	.page03 .section04 .contents [class^=item] .desc {font-size: 12px;}
	.page03 .section04 .contents .boxtxt_wrap .boxtxt {font-size: 12px}
}

.page03 .section05 .contents {display: flex; flex-direction: row; flex-wrap: wrap; gap:2rem}
.page03 .section05 [class^=innerbox] {width:calc(50% - 1rem)}
.page03 .section05 [class^=innerbox] {border-radius: 1.5rem;padding:4rem; display: flex; flex-direction: column;justify-content: space-between; gap:4rem}
.page03 .section05 [class^=innerbox] .icon{width: 6rem ;height:6rem;}
.page03 .section05 [class^=innerbox] .txt_wrap{}
.page03 .section05 [class^=innerbox] .txt_wrap .subtit{font-size: 2rem; font-weight: 600; margin-bottom: 1rem}
.page03 .section05 [class^=innerbox] .txt_wrap .desc {color:#333}

@media screen and (max-width: 768px) {
	.page03 .section05 [class^=innerbox] .txt_wrap .subtit {font-size:14px }
	.page03 .section05 [class^=innerbox] .txt_wrap .desc {font-size: 12px}
	
	.page03 .section05 [class^=innerbox] .icon{width:40px; height:40px}
}
@media screen and (max-width: 500px) {
	.page03 .section05 .contents {flex-direction: column;}
	.page03 .section05 [class^=innerbox] {width:100%}
}


.page03 .section06 [class^=tabitem] {align-items: center; gap: 3.5rem; padding: 3.5rem;}
.page03 .section06 [class^=tabitem].on {display: flex; }
.page03 .section06 [class^=tabitem] .txt_wrap {width:50%;}
.page03 .section06 [class^=tabitem] .txt_inner {}
.page03 .section06 [class^=tabitem] .txt_inner .tit_wrap {margin-bottom: 2rem}
.page03 .section06 [class^=tabitem] .txt_inner .tit_wrap .tit {font-weight: 600; font-size: 2.8rem; margin-bottom: 1rem}
.page03 .section06 [class^=tabitem] .txt_inner .tit_wrap .desc {color:#333;margin-bottom: .5rem}
.page03 .section06 [class^=tabitem] .txt_inner .sub_wrap {display: flex; flex-direction: column; gap:.2rem;margin-bottom: 2rem}
.page03 .section06 [class^=tabitem] .txt_inner .sub_wrap [class^=sub] p {font-size: 2rem; font-weight: 600; margin-bottom: .2rem}
.page03 .section06 [class^=tabitem] .txt_inner .sub_wrap [class^=sub] span {color: var(--color-primary)}
.page03 .section06 [class^=tabitem] .txt_inner .boxtxt_wrap {display: flex; flex-wrap: wrap; gap:1rem;}

.page03 .section06 [class^=tabitem] .img {width:50%; aspect-ratio: 1 / .7; border-radius: 1rem;}

.page03 .section06 .tab_wrap ul [class^=tab] p {width:auto} /* 탭에 아이콘 없을 경우 */

@media screen and (max-width: 768px) {
	.page03 .section06 [class^=tabitem]{flex-direction: column; flex-flow: column-reverse}
	.page03 .section06 [class^=tabitem] .img {width:100%;}
	.page03 .section06 [class^=tabitem] .txt_wrap {width:100%;}
	
	.page03 .section06 [class^=tabitem] .txt_inner .tit_wrap .tit {font-size: 18px}
	.page03 .section06 [class^=tabitem] .txt_inner .tit_wrap .desc {font-size: 12px}
	.page03 .section06 [class^=tabitem] .txt_inner .sub_wrap [class^=sub] p {font-size: 12px}
	.page03 .section06 [class^=tabitem] .boxtxt_wrap [class^=boxtxt] {font-size: 12px}
}

/* ======================== page03 ========================= */

/* ======================= page0301 ======================== */

.page0301 .section02 .innerbox05 {width: 100%; background: #444; border: 1px solid #777;}
.page0301 .section02 .innerbox05 .txt_wrap .subtit {color: #fff;}
.page0301 .section02 .innerbox05 .txt_wrap .desc {color: #ddd;}

.page0301 .section02 .innerbox01 .icon {background: url(../img/sub0301_img0201.png) no-repeat center/contain;}
.page0301 .section02 .innerbox02 .icon {background: url(../img/sub0301_img0202.png) no-repeat center/contain;}
.page0301 .section02 .innerbox03 .icon {background: url(../img/sub0301_img0203.png) no-repeat center/contain;}
.page0301 .section02 .innerbox04 .icon {background: url(../img/sub0301_img0204.png) no-repeat center/contain;}
.page0301 .section02 .innerbox05 .icon {background: url(../img/sub0301_img0205.png) no-repeat center/contain;}

.page0301 .section03 .contents .item01 .img {background: url(../img/sub0301_img0301.jpg) no-repeat center/contain;}
.page0301 .section03 .contents .item02 .img {background: url(../img/sub0301_img0302.jpg) no-repeat center/contain;}
.page0301 .section03 .contents .item03 .img {background: url(../img/sub0301_img0303.jpg) no-repeat center/contain;}
.page0301 .section03 .contents .item04 .img {background: url(../img/sub0301_img0304.jpg) no-repeat center/contain;}
.page0301 .section03 .contents .item05 .img {background: url(../img/sub0301_img0305.jpg) no-repeat center/contain;}



.page0301 .section05 .innerbox01 .icon {background: url(../img/sub0301_img0501.png) no-repeat center/contain;}
.page0301 .section05 .innerbox02 .icon {background: url(../img/sub0301_img0502.png) no-repeat center/contain;}
.page0301 .section05 .innerbox03 .icon {background: url(../img/sub0301_img0503.png) no-repeat center/contain;}
.page0301 .section05 .innerbox04 .icon {background: url(../img/sub0301_img0504.png) no-repeat center/contain;}


.page0301 .section06 .tabitem01 .img {background: url(../img/sub0301_img0601.jpg) no-repeat center/contain;}
.page0301 .section06 .tabitem02 .img {background: url(../img/sub0301_img0602.jpg) no-repeat center/contain;}
.page0301 .section06 .tabitem03 .img {background: url(../img/sub0301_img0603.jpg) no-repeat center/contain;}
.page0301 .section06 .tabitem04 .img {background: url(../img/sub0301_img0604.jpg) no-repeat center/contain;}

/* ======================= page0301 ======================== */
	

/* ======================= page0302 ======================== */

.page0302 .section02 .contents .upperbox {flex-wrap: nowrap; gap:2rem;}
.page0302 .section02 [class^=innerbox] {width:100%}
.page03 .section02 .contents .bottombox {display: flex; justify-content: space-between}
.page0302 .section02 .innerbox04, .page0302 .section02 .innerbox05 {width: calc(50% - 1rem); background: #444; border: 1px solid #777;}
.page0302 .section02 .innerbox04 .txt_wrap .subtit, .page0302 .section02 .innerbox05 .txt_wrap .subtit {color: #fff;}
.page0302 .section02 .innerbox04 .txt_wrap .desc, .page0302 .section02 .innerbox05 .txt_wrap .desc {color: #ddd;}

@media screen and (max-width: 768px) {
	.page03 .section02 [class^=innerbox] .txt_wrap .subtit {font-size:14px }
	.page03 .section02 [class^=innerbox] .txt_wrap .desc {font-size: 12px}
	
	.page03 .section02 [class^=innerbox] .icon{width:40px; height:40px}
}
@media screen and (max-width: 600px) {
	.page0302 .section02 .contents .upperbox {flex-direction:column; gap: 2rem; }
	.page0302 .section02 .contents .bottombox {flex-direction:column; gap: 2rem;}
	.page0302 .section02 [class^=innerbox] {width:100%}
	
}
.page0302 .section02 .innerbox01 .icon {background: url(../img/sub0302_img0201.png) no-repeat center/contain;}
.page0302 .section02 .innerbox02 .icon {background: url(../img/sub0302_img0202.png) no-repeat center/contain;}
.page0302 .section02 .innerbox03 .icon {background: url(../img/sub0302_img0203.png) no-repeat center/contain;}
.page0302 .section02 .innerbox04 .icon {background: url(../img/sub0302_img0204.png) no-repeat center/contain;}
.page0302 .section02 .innerbox05 .icon {background: url(../img/sub0302_img0205.png) no-repeat center/contain;}

.page0302 .section03 .contents .item01 .img {background: url(../img/sub0302_img0301.jpg) no-repeat center/contain;}
.page0302 .section03 .contents .item02 .img {background: url(../img/sub0302_img0302.jpg) no-repeat center/contain;}
.page0302 .section03 .contents .item03 .img {background: url(../img/sub0302_img0303.jpg) no-repeat center/contain;}
.page0302 .section03 .contents .item04 .img {background: url(../img/sub0302_img0304.jpg) no-repeat center/contain;}
.page0302 .section03 .contents .item05 .img {background: url(../img/sub0302_img0305.jpg) no-repeat center/contain;}


.page0302 .section05 .innerbox01 .icon {background: url(../img/sub0302_img0501.png) no-repeat center/contain;}
.page0302 .section05 .innerbox02 .icon {background: url(../img/sub0302_img0502.png) no-repeat center/contain;}
.page0302 .section05 .innerbox03 .icon {background: url(../img/sub0302_img0503.png) no-repeat center/contain;}
.page0302 .section05 .innerbox04 .icon {background: url(../img/sub0302_img0504.png) no-repeat center/contain;}
.page0302 .section05 .innerbox05 .icon {background: url(../img/sub0302_img0505.png) no-repeat center/contain;}


.page0302 .section06 .tabitem01 .img {background: url(../img/sub0302_img0601.jpg) no-repeat center/contain;}
.page0302 .section06 .tabitem02 .img {background: url(../img/sub0302_img0602.jpg) no-repeat center/contain;}
.page0302 .section06 .tabitem03 .img {background: url(../img/sub0302_img0603.jpg) no-repeat center/contain;}
.page0302 .section06 .tabitem04 .img {background: url(../img/sub0302_img0604.jpg) no-repeat center/contain;}
.page0302 .section06 .tabitem05 .img {background: url(../img/sub0302_img0605.jpg) no-repeat center/contain;}


/* ======================= page0302 ======================== */


/* ======================= page0303 ======================== */

.page0303 .section02 .inner_tit_wrap {display: flex; gap: 3rem;; align-items: baseline; margin: 5rem 0 2rem}
.page0303 .section02 .inner_tit {font-size: 2.8rem; font-weight: 600}
.page0303 .section02 .inner_tit:before {width:.7rem; height: .7rem;}
.page0303 .section02 .inner_desc {color:#333;}

@media screen and (max-width: 768px) {
	.page0303 .section02 .inner_tit_wrap {flex-direction: column; gap:0;}
	.page0303 .section02 .inner_desc {padding-left: 2rem;}
}

.page0303 .section02 .slider {display: flex; gap: 2rem;}
.page0303 .section02 .inner_contents01 [class^=item] {padding: 3.5rem; width:33rem; min-width: 33rem; display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between}
.page0303 .section02 .inner_contents01 [class^=item] .txt_wrap {width: 100%;}
.page0303 .section02 .inner_contents01 [class^=item] .subtit {font-size: 2rem; font-weight: 600; margin-bottom: 1rem}
.page0303 .section02 .inner_contents01 [class^=item] .desc {color:#333;}
.page0303 .section02 .inner_contents01 [class^=item] .disc:before {background: #bbb;}
.page0303 .section02 .inner_contents01 [class^=item] .icon {width: 8rem; aspect-ratio: 1 / 1;}

@media screen and (max-width: 1024px) {
	.page0303 .section02 .inner_contents01 [class^=item] {width:25%;}
}

@media screen and (max-width: 768px) {
	.page0303 .section02 .inner_tit {font-size: 18px;}
	.page0303 .section02 .inner_desc {font-size: 12px;}
	
	.page0303 .section02 .inner_contents01 [class^=item] .subtit {font-size:14px }
	.page0303 .section02 .inner_contents01 [class^=item] .desc {font-size: 12px}
	
	.page0303 .section02 .inner_contents01 [class^=item] {width:40rem; min-width: 40rem;}
	.page0303 .section02 .inner_contents01 [class^=item] .icon{width:12rem; height:12rem}
}

.page0303 .section02 .inner_contents02 .inner_item_wrap {display: flex; gap:2rem;}
.page0303 .section02 .inner_contents02 [class^=item] {padding: 3.5rem; width:25%; display: flex; gap: 3rem; flex-direction: column; justify-content: space-between}
.page0303 .section02 .inner_contents02 [class^=item] .icon {width: 6rem; aspect-ratio: 1 / 1;}
.page0303 .section02 .inner_contents02 [class^=item] .subtit {font-size: 2rem; font-weight: 600;}

@media screen and (max-width: 768px) {
	.page0303 .section02 .inner_contents02 .inner_item_wrap {flex-wrap: wrap}
	.page0303 .section02 .inner_contents02 [class^=item] {width:calc(50% - 1rem);}
	.page0303 .section02 .inner_contents02 [class^=item] .subtit {font-size:14px }
	.page0303 .section02 .inner_contents02 [class^=item] .desc {font-size: 12px}
	.page0303 .section02 .inner_contents02 [class^=item] .icon {width:40px; height:40px}
}
@media screen and (max-width: 360px) {
	.page0303 .section02 .inner_contents02 .inner_item_wrap {flex-direction: column}
	.page0303 .section02 .inner_contents02 [class^=item] {width:100%;}
}

.page0303 .section02 .inner_contents03 .inner_item_wrap { display: flex; justify-content: space-between; align-items: flex-start}
.page0303 .section02 .inner_contents03 [class^=item] {width: 30%;}
.page0303 .section02 .inner_contents03 [class^=item] .sup {font-size: 1.6rem; font-weight: 600; color: #333; padding-bottom: 1.5rem; border-bottom: 1px solid #333; width: 100%; }
.page0303 .section02 .inner_contents03 [class^=item] .subtit {font-size: 2.4rem; font-weight: 600; color:#333; display: flex; align-items: baseline; gap: 1rem;}
.page0303 .section02 .inner_contents03 [class^=item] .subtit span{font-size: 6rem; font-weight: 800; color:#000;}
.page0303 .section02 .inner_contents03 [class^=item] .disc:before {background: #bbb;}

@media screen and (max-width: 768px) {
	.page0303 .section02 .inner_contents03 [class^=item] .sup {font-size: 12px;}
	.page0303 .section02 .inner_contents03 [class^=item] .subtit {font-size: 16px;}
	.page0303 .section02 .inner_contents03 [class^=item] .subtit span{font-size: 30px}
	.page0303 .section02 .inner_contents03 [class^=item] .desc_wrap {font-size: 12px}
}
@media screen and (max-width: 500px) {
	.page0303 .section02 .inner_contents03 .inner_item_wrap {flex-direction: column; gap: 3rem;}
	.page0303 .section02 .inner_contents03 [class^=item] {width: 100%;}
}



.page0303 .section03 .inner_tit_wrap {display: flex; gap: 3rem;; align-items: baseline; margin: 5rem 0 2rem}
.page0303 .section03 .inner_tit {font-size: 2.8rem; font-weight: 600}
.page0303 .section03 .inner_tit:before {width:.7rem; height: .7rem;}
.page0303 .section03 .inner_desc {color:#333;}

@media screen and (max-width: 768px) {
	.page0303 .section03 .inner_tit_wrap {flex-direction: column; gap:0;}
	.page0303 .section03 .inner_desc {padding-left: 2rem;}
}

.page0303 .section03 .inner_item_wrap {display: flex; gap: 2rem; justify-content: space-between}
.page0303 .section03 .inner_contents01 [class^=item] {padding: 3.5rem; width:33.33%; display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between}
.page0303 .section03 .inner_contents01 [class^=item] .txt_wrap {width: 100%;}
.page0303 .section03 .inner_contents01 [class^=item] .subtit {font-size: 2rem; font-weight: 600; margin-bottom: 1rem}
.page0303 .section03 .inner_contents01 [class^=item] .desc {color:#333;}
.page0303 .section03 .inner_contents01 [class^=item] .disc:before {background: #bbb;}
.page0303 .section03 .inner_contents01 [class^=item] .icon {width: 8rem; aspect-ratio: 1 / 1;}

@media screen and (max-width: 1024px) {
	.page0303 .section03 .inner_contents01 [class^=item] {aspect-ratio: 1 / 0;}
}

@media screen and (max-width: 768px) {
	.page0303 .section03 .inner_tit {font-size: 18px;}
	.page0303 .section03 .inner_desc {font-size: 12px;}
	
	.page0303 .section03 .inner_contents01 [class^=item] .subtit {font-size:14px }
	.page0303 .section03 .inner_contents01 [class^=item] .desc {font-size: 12px}
	
	.page0303 .section03 .inner_contents01 [class^=item] .icon{width:12rem; height:12rem}
}

@media screen and (max-width: 600px) {
	.page0303 .section03 .inner_item_wrap {flex-direction: column}
	.page0303 .section03 .inner_contents01 [class^=item] {width:100%}
}





.page0303 .section04 .contents .item_wrap {display: flex; flex-direction: row; gap:2rem; padding: 0; min-width: auto}
.page0303 .section04 .contents .item_wrap [class^=item] {display: flex; gap:1rem; width:33.33%; min-width: inherit; padding:3rem; flex-direction: column; }

.page0303 .section04 .contents .top_wrap {padding-bottom: 3rem; border-bottom: 1px solid #999; margin-bottom: 3rem;}
.page0303 .section04 .contents .top_wrap .sup {display: inline-block; padding: .3rem 1rem; color: var(--color-primary); font-size: 1.4rem; font-weight: 600; border:1px solid #ffd3bf; border-radius: 100px;  background: #fff1eb; margin-bottom: 2.5rem;}
.page0303 .section04 .contents .top_wrap .subtit {margin-bottom: 1rem;font-weight: bold; font-size: 2rem;}
.page0303 .section04 .contents .top_wrap .desc {}

.page0303 .section04 .contents .bottom_wrap {display: flex; flex-direction: column; gap: 4rem;}
.page0303 .section04 .contents .bottom_wrap .subtit {color:#333; margin-bottom: 1rem;}
.page0303 .section04 .contents .bottom_wrap .desc {color:#555;}
.page0303 .section04 .contents .bottom_wrap .desc:before {background: #bbb;}
.page0303 .section04 .contents .item_wrap [class^=item] .boxtxt_wrap {display: flex; gap:1rem; flex-wrap: wrap; justify-content: end;}

.page0303 .section04 .contents .note {display: flex; align-items: center; margin-top: 1rem; font-size: 1.6rem; color:#555;}

@media screen and (max-width: 620px) {
	.page0303 .section04 .contents .item_wrap {flex-direction: column}
	.page0303 .section04 .contents .item_wrap [class^=item] {width:100%;}
	.page0303 .section04 .contents .top_wrap .sup {font-size: 10px;padding: .3rem 1.3rem;}
	.page0303 .section04 .contents .item_wrap [class^=item] .subtit {font-size: 14px;}
	.page0303 .section04 .contents .item_wrap [class^=item] .desc {font-size: 12px;}
	.page0303 .section04 .contents .note {font-size: 12px;}
}


.page0303 .section02 .inner_contents01 .item01 .icon {background: url(../img/sub0303_img0201.png) no-repeat center/contain;}
.page0303 .section02 .inner_contents01 .item02 .icon {background: url(../img/sub0303_img0202.png) no-repeat center/contain;}
.page0303 .section02 .inner_contents01 .item03 .icon {background: url(../img/sub0303_img0203.png) no-repeat center/contain;}
.page0303 .section02 .inner_contents01 .item04 .icon {background: url(../img/sub0303_img0204.png) no-repeat center/contain;}
.page0303 .section02 .inner_contents01 .item05 .icon {background: url(../img/sub0303_img0205.png) no-repeat center/contain;}

.page0303 .section02 .inner_contents02 .item01 .icon {background: url(../img/sub0303_img0206.png) no-repeat center/contain;}
.page0303 .section02 .inner_contents02 .item02 .icon {background: url(../img/sub0303_img0207.png) no-repeat center/contain;}
.page0303 .section02 .inner_contents02 .item03 .icon {background: url(../img/sub0303_img0208.png) no-repeat center/contain;}
.page0303 .section02 .inner_contents02 .item04 .icon {background: url(../img/sub0303_img0209.png) no-repeat center/contain;}


.page0303 .section03 .item01 .icon {background: url(../img/sub0303_img0301.png) no-repeat center/contain;}
.page0303 .section03 .item02 .icon {background: url(../img/sub0303_img0302.png) no-repeat center/contain;}
.page0303 .section03 .item03 .icon {background: url(../img/sub0303_img0303.png) no-repeat center/contain;}


/* ======================= page0303 ======================== */





/* ======================= privacy ======================== */

.privacy .section01 .head_comm .title, .privacy .section02 .head_comm .title {font-size: 2.8rem;}
.privacy .group_section {margin-top: 10rem}
.privacy .section01 {margin-bottom: 6rem}
@media screen and (max-width: 768px) {
	.privacy .head_comm .title {font-size: 18px}
	.privacy .contents {font-size: 14px}
}
.privacy .disc:before {background: #bbb}


.privacy .section00 {margin-bottom: 6rem}
.privacy .section00 .head_comm {display: flex; align-items: flex-end; gap: 2rem; }
.privacy .section00 .head_comm .view_full {font-size: 14px; font-weight: 600; text-decoration: underline; color:#777; cursor: pointer;transition: .3s}
.privacy .section00 .head_comm .view_full:hover {color:#000}

.inquiry_overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 999;
}

.overlay-content {
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -60%);
  width: 70vw;
  height: 70vh;
  background-color: #fff;
  padding: 30px 10px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
  border-radius:30px;
  padding: 20px 10px;
}

#closeresources {
  position: absolute;
  top: 50px;
  right: 60px;
  color: #fff;
  border: none;
  cursor: pointer;
	z-index: 999;
 
}

.overlay-content .full_inner {
  width: 100%;
  height: 100%;
	padding: 5rem;
	overflow-y: scroll
}
	
@media (max-width: 1280px){
	#closeresources {top: 20px; right: 20px; }
}
@media (max-width: 767px){
	.overlay-content{width: 80vw; height: 80vh;}
}
@media (max-width: 360px){
	.overlay-content{width: 90vw;}
	#closeresources {top: 15px; right: 15px;}
}



#privacy_overlay .overlay-content .head_comm .title {margin-bottom: 0.2em; font-size: 3.2rem;}
#privacy_overlay .overlay-content .head_comm .sup {font-size: 12px; margin-top: .6em}
#privacy_overlay .overlay-content .head_comm .desc {font-size: 14px; margin-top: 1rem;}
@media screen and (max-width: 1024px) {
    #privacy_overlay .overlay-content .head_comm .title { font-size: 24px; }
}
#privacy_overlay .overlay-content .contents {display: flex; flex-direction: column; gap: 2rem; margin-top: 1.5em}
#privacy_overlay .overlay-content .contents > div {display: flex; flex-direction: column; gap: 0.4em}
#privacy_overlay .overlay-content .contents > div:after {content: ''; display: block; width:100%; height:1px; background: #ddd; margin-top: 2rem;}
#privacy_overlay .overlay-content .contents .article_tit	{font-weight: 600; font-size: 16px}
#privacy_overlay .overlay-content .contents .article_tit_desc {font-size: 14px}
#privacy_overlay .overlay-content .contents .article_subtit {font-size: 14px; font-weight: 600}
#privacy_overlay .overlay-content .contents ul li {font-size: 14px; padding-left: 10px;}
#privacy_overlay .overlay-content .contents ul li:before {background: #bbb;width:3px; height: 3px; top: .7em;}
#privacy_overlay .overlay-content .contents p {font-size: 14px}

/* ======================= privacy ======================== */



/* Approved credential artwork: content widths, shared height, transparent assets. */
.brand-credentials {
  display: grid;
  grid-template-columns: var(--brand-pc-columns);
  align-items: center;
  gap: 24px;
  width: min(100%, var(--brand-limit, 560px), var(--brand-pc-natural));
  max-width: 100%;
  margin: 24px auto 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.brand-credentials picture { display: block; min-width: 0; }
.brand-credentials img {
  display: block; width: 100%; height: auto;
  aspect-ratio: var(--brand-pc-ratio); object-fit: contain;
}
@media screen and (max-width: 1024px) {
  .brand-credentials {
    grid-template-columns: var(--brand-mo-columns);
    gap: 12px; margin-top: 16px;
    width: min(100%, var(--brand-limit, 360px), var(--brand-mo-natural));
  }
  .brand-credentials img { aspect-ratio: var(--brand-mo-ratio); }
}

.page0101 .section01 {
  flex-direction: column; aspect-ratio: auto;
  min-height: clamp(400px, 40vw, 640px); padding: 48px 0;
}
.page0101 .section01 .head_comm { width: 100%; }
.page0101 .brand-credentials { --brand-limit: 600px; }
@media screen and (max-width: 1024px) {
  .page0101 .section01 { min-height: 0; padding: 48px 0; }
  .page0101 .brand-credentials { --brand-limit: 400px; }
}