@charset "utf-8";

.stit1 { font-size: 1.45em; font-family: 'ONE-Mobile-Title'; font-weight: normal; margin-bottom: 0.6em; color:#2d3290;  }
.stit1.big { font-size: 1.75em; }
.stit2 { font-size: 1.35em; font-family: 'ONE-Mobile-Title'; font-weight: normal; margin-bottom: 0.6em; color:#05b5b2; }
.stit3 { font-size: 1.3em; font-family: 'ONE-Mobile-Title'; font-weight: normal; margin-bottom: 0.8em;  color:#2d3290; }
.stit4 { font-size: 1.15em; color:#212121; margin-bottom: 0.6em; }
.stit5 { font-size: 1.2em; color:#05b5b2; margin-bottom: 0.6em; font-weight: 800; }
.stit5.mbs { margin-bottom: 0.3em; }

.stxt1 { line-height: 1.8em; }
.stxt2 { font-size: 1.125em;  line-height: 1.6em; }

.typo1 { font-family: 'ONE-Mobile-Title'; font-weight: normal; color:#2d3290; font-size: 1.75em; line-height: 1.35em; letter-spacing: 0;   }
.caption { text-align: right; font-size: 0.9em; color:#989898; }
.tel { color:#212121; font-weight: 700; font-size: 1.25em; line-height: 2em; }
.tel span { margin-left: 0.4em; font-size: 1.5em; color:#437dea; font-weight: 800; }
.underline { display: inline-block; border-bottom: 1px solid #999; }
.link { color:#6485c5; }
.link::after { content:'\e852'; font-family:'Linearicons-Free'; margin-left: 0.5em; font-size: 0.95em; }
.mail_to { color:#6485c5; }
.mail_to::before { content:'\e818'; font-family:'Linearicons-Free'; margin-right: 0.5em; font-weight: 600;}
.fs-s1 { font-size: 0.95em; }
.fs-s2 { font-size: 0.9em; }
.fs-s3 { font-size: 0.8em; }
.fs-e1 { font-size: 1.2em;  }
.em1 { font-size: 1.6em; font-weight: 300; }
.em2 { font-size: 1.05em; color:#2d3290; font-weight: 500; line-height: 1.5em; }
.em3 { font-size: 1.125em; color:#212121; font-weight: 500; line-height: 1.5em; }
.txt-in { padding-left: 1em; }

.note { padding-left: 1em; position: relative; }
.note::before { content: "※"; position: absolute; left:0; }


@media all and (max-width:767px) {
  .stxt1 br { display: none; }
  .stxt1 br.mo { display: block; }
  .typo1 { font-size: 1.5em; max-width: 70%; margin: 0 auto; }
}

@media all and (max-width:480px) {
  .tel { font-size: 1.2em; }
  .tel span { font-size: 1.3em; margin-left: 0.2em; }
}


.titBG { border-top: 3px solid #2d3290;  border-bottom: 1px solid #d7dee7; background: #f4fafd; padding: 5%; line-height: 1.5em; }
.titBG.pds { padding: 4%; }
.titBG .stit1 { font-size: 1.6em; }


.slsBox { background: url("/images/common/slsline.png") repeat; padding: 5px; }
.slsBox2 { background: url("/images/common/slsline.png") repeat-x left top; padding: 4% 0; }

.dotBox { position: relative;  background: url("/images/common/dotBG.png") repeat-x, url("/images/common/dotBG.png") repeat-y; padding: 1px; }
.dotBox::before { content: ''; position: absolute; width: 100%; height: 1px; background: url("/images/common/dotBG.png") repeat; left:0; bottom:0; }
.dotBox::after { content: ''; position: absolute; width: 1px; height: 100%; background: url("/images/common/dotBG.png") repeat; right:0; top:0; }
.dotBox > div { padding: 4%; }

.BGwh { background: #fff; }
.BGgr { background: #f4f5f9; padding: 2% 3%;  }
.BGgr2 { background: #f9fafc; padding: 3% 4%; }
.BGsk { background: #f4fafd; padding: 3% 4%;  }
.slsBox .BGwh { padding: 3%; }
.slsBox .BGwh.pdb { padding: 4% 3%; }

.bdBox { border: 7px solid #eaf3fa; padding: 3%; }
.bdBox2 { border: 1px solid #d7dee7; }
.bdBox2 > .bdBox { border-width: 8px; padding: 5%; }

.bdBox.ver2 { padding: 10px; }
.bdBox.ver2 > .bdBox2 { padding: 4%; border-color:#e5f1fb; }

@media all and (max-width:767px) {
  .slsBox .BGwh { padding: 5%; }
  .bdBox2 > .bdBox { padding: 7% 5%; }
}



.i_label { display: inline-block; vertical-align: middle; margin-right: 1em; }
.schBox { position: relative; width: 400px; max-width: 70%;  height:40px; border: 1px solid #2d3290; display: inline-block; vertical-align: middle; overflow: hidden; }
.schBox input.sch_str { width: calc(100% - 50px);  border:0; padding: 0 1em; height: 38px; line-height: 38px; float: left; }
.schBox .sch_btn { position: absolute; right:-1px; top:-1px; width: 50px; height: 40px; border:0; font-size:0;
                        background: #2d3290 url("/images/common/ico_search.png") no-repeat center;  }

@media all and (max-width:640px) {
  .schBox { height: 35px; }
  .schBox input.sch_str { width: calc(100% - 50px);  height: 33px; line-height: 33px; }
  .schBox .sch_btn { width: 50px; height: 35px; background-size: 100% auto; }
}


.btn_st { border-radius: 3px; padding: 0 1em; border:0; color:#fff; line-height: 2.5em; cursor: pointer; font-size: 0.9em; display: inline-block; }
.btn1 { background: #00a3a0; }
.btn2 { background: #2d3290; }
.btn3 { background: #e74875; }

.btn1:hover { background: #008886; }

.btn_st.small { line-height: 2em; font-size: 0.85em; }
.btn_st.big { line-height: 3em; font-size: 1.125em; padding: 0 2em; }


.btn_more { background: #437dea; border-radius: 3px; padding: 0 1em; border:0; color:#fff; line-height: 2.5em; display: inline-block;  }
.btn_more p::after { content:'→'; margin-left: 1em;  }
.btn_more:hover { background: #2968df; }

.btn_down::after { content: '\e865'; font-family:'Linearicons-Free'; margin-left: 1em; }

.imgWrap { overflow: hidden; font-size:0; }
.imgWrap img { display: inline-block; max-width: calc(100% / 3 - 20px); }
.imgWrap.col3 img { margin-left: 10px; }
.imgWrap.col3 img:first-child { margin-left:0; }

@media all and (max-width:767px) {
  .imgWrap img { display: inline-block; max-width: calc(100% / 3 - 10px); }
  .imgWrap.col3 img { margin-left: 5px; }
}


.tb-respon.tb-schedule tr th,
.tb-respon.tb-schedule tr td { height: 120px;  }

@media all and (max-width:320px) {
  .tb-respon.tb-schedule tr th,
  .tb-respon.tb-schedule tr td { height: auto;  }
}



.tb-style1 { position: relative; width: 100%; border-top: 2px solid #2d3290; }
.tb-style1 tr th { width: 20%; background: #f4fafd; font-weight: 600; color:#2d3290; padding: 1em; border-bottom: 1px solid #d7dee7; }
.tb-style1 tr td { padding: 1em; border-bottom: 1px solid #d7dee7; border-left: 0px solid #d7dee7; }
.tb-style1.col2.w100 tr th { clear: both; float: left; width: 30%; }
.tb-style1.col2.w100 tr td { float: left; width: 70%; }
.tb-style1 tr td.th { width: 20%;  font-weight: 600; color:#212121; text-align: center; border-left: 1px solid #dae8ee; border-right: 1px solid #d7dee7; background: #f9fafc; }

.tb-style1.wide tr th { width: 25%; }

.tb-style1.col3 tr th { width: 15%; }
.tb-style1.col4 tr th { width: 12.5%; }

.tb-style1.tb-tel { font-size: 0.95em; }
.tb-style1.tb-tel tr th { width: 14%;  padding: 1em 0.5em; }
.tb-style1.tb-tel tr td { padding: 1em 0.5em; }

.tb-style1 + .tb-style1 { margin-top: 2em; }

.tb-style1.tb-tel { min-width: 800px; }

@media all and (max-width:767px) {
  .tb-style1.wide tr th { width: 30%; }
}


@media all and (max-width:640px) {
  .tb-style1.col2 colgroup { display: none; }
  .tb-style1.col2 tr th { clear: both; float: left; width: 30%; }
  .tb-style1.col2 tr td { float: left; width: 70%; }

  .tb-style1.col2.wide tr th { width: 40%; }
  .tb-style1.col2.wide tr td { width: 60%; }

 .nbsp { display: none; }

  .tb-style1.col4 tr th { float: left; width: 20%; }
  .tb-style1.col4 tr td { float: left; width: 30%; }

}

@media all and (max-width:480px) {
  .tb-style1 tr th { width: 25%; }
  .tb-style1.col3 tr th { float: left; width: 30%; }
  .tb-style1.col3 tr td { float: left; width: 70%; }
}

@media all and (max-width:320px) {
  .tb-style1 { border-left: 1px solid #d7dee7; border-right: 1px solid #d7dee7; }
  .tb-style1 tr th { display: block; width: 100%; }
  .tb-style1 tr td { display: block; width: 100%; border-left:0; text-align: center;}
  .tb-style1.wide tr th { width: 100%; }
  .tb-style1 tr td.th { width: 100%; border-left:0; border-right:0;  }

  .tb-scroll .tb-style1 tr th { display: table-cell; width: auto;  }
  .tb-scroll .tb-style1 tr td { display: table-cell; width: auto; }
}


.tb-style2 { position: relative; width: 100%; border-top: 2px solid #2d3290; border-right: 1px solid #e2eaf4;}
.tb-style2 thead tr th { background: #f4fafd; font-weight: 600; color:#2d3290; padding: 1em; border-bottom: 2px solid #dae8ee; border-left: 1px solid #e2eaf4;}
.tb-style2 tr th { background: #f4fafd; font-weight: 600; color:#437dea; padding: 1em; border-bottom: 1px solid #e2eaf4; border-left: 1px solid #e2eaf4; }
.tb-style2 tr td { padding: 1em; border-bottom: 1px solid #e2eaf4; border-left: 1px solid #e2eaf4; }
.tb-style2 tr th.thead { color:#2d3290; border-bottom: 2px solid #dae8ee; }

.tb-style2.pds tr td { font-size: 0.9em; padding: 0.8em;  }
.tb-style2.pds tr td a{color: #fff; background-color: #2d3290; padding: 0.5em 1em; border-radius: 5px;}
.tb-style2.pds tr td a:hover{background-color: #437dea;}
.tb-style2.small tr th,
.tb-style2.small tr td { font-size: 0.9em; padding: 0.8em; line-height: 1.3em; }
.tb-style2.small thead tr th { font-size: 0.85em; padding: 0.8em; }


.tb-scroll.dozen table { float: left; vertical-align: top; }
.tb-scroll.dozen table.wid8 { width: 65%; }
.tb-scroll.dozen.mg table.wid8 { width: calc(65% - 20px); }
.tb-scroll.dozen table.wid4 { width: 35%; }
.tb-scroll.dozen table.wid24 { width: 20%; }
.tb-scroll.dozen table.half { width: calc(50% - 10px);  }

.tb-scroll.dozen table { border-right-width:0;}
.tb-scroll.dozen table:last-child { border-right-width:1px; }
.tb-scroll.dozen table + table { border-left: 1px solid #aed0df; }

.tb-scroll.dozen.mg table { border-right-width: 1px; margin-right: 20px; }
.tb-scroll.dozen.mg table + table { border-left:0;   }
.tb-scroll.dozen.mg table:last-child { margin-right:0; }


@media all and (max-width:976px) {
  .tb-scroll.dozen table.wid8 { width: 60%; }
  .tb-scroll.dozen table.wid4 { width: 40%; }
}

@media all and (max-width:640px) {
  .tb-scroll.dozen table.wid8 { width: 100%; }
  .tb-scroll.dozen table.wid4 { width: 100%; }
  .tb-scroll.dozen.mg table.wid8 { width: 100%; }
  .tb-scroll.dozen table + table { border-left-width: 0; }
  .tb-scroll.dozen.mg table + table {  margin-top: 10px;  }
}



.dotList > li { position: relative; margin: 0.3em 0; padding-left: 14px; line-height: 1.4em; text-align: left; }
.dotList > li::before { content:''; position: absolute; left:0; top: 0.7em; margin-top: -2px; width: 4px; height: 4px; background:#1dc067;  }

.dotList .dotList2 { padding-top: 0.3em; }

.dotList2 > li { position: relative; margin: 0.4em 0;  font-size: 0.95em; padding-left: 10px; line-height: 1.4em; text-align: left; }
.dotList2 > li::before { content: '';  position: absolute; left:0; top: 0.65em; margin-top: -1.5px; width: 3px; height: 3px; background:#437dea; border-radius: 6px; }

.dotList.col2,
.dotList.col3 { overflow: hidden; }
.dotList.col2 li { width: 50%; float: left; }
.dotList.col3 li { width: calc(100% / 3); float: left; }

.dot { position: relative; margin: 0.3em 0; padding-left: 14px; line-height: 1.4em; text-align: left; }
.dot::before { content:''; position: absolute; left:0; top: 0.7em; margin-top: -2px; width: 4px; height: 4px; background:#1dc067;  }
.dot.ver2 { font-size: 0.95em; }
.dot.ver2::before {  top: 0.65em; margin-top: -1.5px; width: 3px; height: 3px; background:#437dea; border-radius: 6px; }


table td .dotList,  table td .dotList2, table td .dot { min-width: 50%; }
table td .dotList2 li, table td .dot  { margin:0; }


@media all and (max-width:767px) {
  .dotList.col2 li,
  .dotList.col3 li  { width: 100%; }
}


.orderList > li { margin: 0.5em 0; }
.orderList > li span { display: inline-block; vertical-align: top; }
.orderList > li p { display: inline-block; vertical-align: top;  max-width: calc(100% - 2em); }


.orderList2 { overflow: hidden; text-align: left; }
.orderList2 > li { position: relative; counter-increment: number; margin: 0.2em 0; border-bottom: 1px dashed rgba(255,255,255,0.2); }
.orderList2 > li::before {  content: counter(number, decimal-leading-zero); color:#fff;
                              width: 30px; line-height: 30px; display: inline-block; margin-right: 1em;
                              background:#05b5b2; border-radius: 70px; text-align: center;
                              font-size: 0.7em; font-weight: 700; vertical-align: middle; }
.orderList2 > li > p { display: inline-block; max-width: calc(100% - 30px - 1em); vertical-align: middle;
                      font-weight: 400; font-size: 1.05em; line-height: 1.5em; }

.orderList2.color2 > li::before { background: #6496f4; }

.orderList2.small > li::before { width: 26px; line-height: 26px; margin-right: 0.7em; }
.orderList2.small > li > p { font-size: 1.0em; max-width: calc(100% - 26px - 0.7em); }

.orderList2.half > li { width: 50%; float: left; }
.orderList2.col3 > li { width: calc(100% / 3); float: left; }



@media all and (max-width:976px) {
  .orderList2.col3 > li { width: calc(100% / 2); }
}

@media all and (max-width:568px) {
  .orderList2.half > li,
  .orderList2.col3 > li { width: 100%; }
  .orderList2 > li::before { width: 26px; line-height: 26px; }
}


.icoCont { display: table; width: 100%; table-layout: fixed; }
.icoCont > div { display: table-cell; vertical-align: middle; }
.icoCont > div.vtop { vertical-align: top; }
.icoCont .ico { width: 20%; text-align: center; }
.icoCont .ico img { max-width: 70%; }

@media all and (max-width:767px) {
  .icoCont .ico { width: 25%; text-align: left; }
}

@media all and (max-width:480px) {
    .icoCont .ico { width: 100%; text-align: center; }
    .icoCont .ico img { width: 70px; max-width: 50%; }
    .icoCont > div { float: left; width: 100%; text-align: center; }
}


.imgCont  { display: table; width: 100%; table-layout: fixed; }
.imgCont > div { display: table-cell; vertical-align: middle; }
.imgCont .img { position: relative; text-align: center; width: 20%; padding: 3% 0; border: 10px solid #edf5f7;  }
.imgCont .img::before { content:''; width: calc(100% + 20px); height: calc(100% + 20px); border: 1px solid #ddd; position: absolute; left:-10px; top:-10px; }
.imgCont .img img { max-width: 100%; }

.imgCont .cont { padding-left: 4%; }


@media all and (max-width:767px) {
  .imgCont .img { width: 25%; }
}

@media all and (max-width:640px) {
  .imgCont .img { width: 100px; padding: 0; border-width: 0; vertical-align: top; text-align: left; }
  .imgCont .img::before { display: none; }
  .imgCont .cont { padding-left: 3%; }
}

@media all and (max-width:480px) {
  .imgCont .img { width: 80px; }
}

@media all and (max-width:320px) {
  .imgCont { display: block; }
  .imgCont > div  { display: block; }
  .imgCont .img { width: 100%; text-align: center; }
  .imgCont .cont { padding-left: 0; padding: 5% 0; }
}


#greeting { overflow: hidden; }
#greeting > div { float: left; }
#greeting .img { width: 29%; }
#greeting .img img { max-width: 100%; }
#greeting .txt { width: 62%; padding: 2% 0 2% 5%; }
#greeting .txt .typo { font-family: 'ONE-Mobile-Title'; font-weight: normal; color:#2d3290; font-size: 1.75em; line-height: 1.35em; letter-spacing: 0; }
#greeting .txt .typo .em { font-size: 1.2em; }
#greeting .txt p { line-height: 1.8em; }
#greeting .txt p + p { margin-top: 1.8em; }
#greeting .txt p.sign { color:#212121; }
#greeting .txt p.sign span { font-size: 2.125em; font-family: 'ROEHOE-CHAN'; margin: 0 0.3em; letter-spacing: 0.05em; }


@media all and (max-width:767px) {
  #greeting .img { width: 45%; }
  #greeting .txt { width: 55%; }
  #greeting .txt .typo { font-size: 1.5em; }
  #greeting .txt p + p { margin-top: 1.5em; }
}

@media all and (max-width:640px) {
  #greeting > div { width: 100% !important; }
  #greeting .img { text-align: center; }
  #greeting .img img { max-width: 54%; }
  #greeting .txt { padding: 7% 0 0 0; }
}

@media all and (max-width:360px) {
    #greeting .img img { max-width: 70%; }
    /* #greeting .img img { max-width: 100%; } */
}



#directorLIst { overflow: hidden; text-align: center; }
#directorLIst li { position: relative; float: left; width: calc((100% - 60px) / 4); border: 1px solid #d7dee7; margin-left: 20px; margin-bottom: 20px;  padding: 3%; }
#directorLIst li:nth-child(4n+1) { margin-left:0; }
#directorLIst li::before { content:''; width: 100%; height: 100%; background: none; border: 8px solid #edf5f7; display: block; position: absolute; top:0; left:0; }
#directorLIst li img { max-width: 100%; }
#directorLIst li .label { position: absolute; left: 20px; top:0; background: #437dea; color:#fff; width: 60px; height: 60px; line-height: 60px;
                                 border-radius: 0 0 30px 30px; font-family: 'ONE-Mobile-Title'; letter-spacing: 0; }
#directorLIst li dl { margin-top: 1em; }
#directorLIst li dl dt { color:#212121; font-family: 'ONE-Mobile-Title'; letter-spacing: 0; font-size: 1.125em; margin-bottom: 0.5em; }
#directorLIst li dl dd { color:#7b8597; }


@media all and (max-width:1280px) {
  #directorLIst li .label { width: 50px; height: 50px; line-height: 50px; font-size: 0.9em; }
}

@media all and (max-width:767px) {
  #directorLIst li { width: calc((100% - 40px) / 3); }
  #directorLIst li .label { left: 10px; }
  #directorLIst li:nth-child(4n+1) { margin-left:20px; }
  #directorLIst li:nth-child(3n+1) { margin-left:0; }
}

@media all and (max-width:640px) {
  #directorLIst li { width: calc((100% - 20px) / 3); margin-left: 10px; margin-bottom: 10px;  }
  #directorLIst li .label { width: 40px; height: 40px; line-height: 40px;  }
  #directorLIst li:nth-child(4n+1) { margin-left:10px; }
  #directorLIst li:nth-child(3n+1) { margin-left:0; }
}

@media all and (max-width:568px) {
  #directorLIst li { width: calc(50% - 7px); margin-left: 14px !important; margin-bottom: 14px;  padding: 5%; }
  #directorLIst li:nth-child(odd) { margin-left:0  !important; }
  #directorLIst li::before { border-width: 5px; }
}


.cont-top { position: relative; width: 100%; height: 400px; background-size: cover; background-position: center top; background-repeat: no-repeat;
                border-radius: 80px 0 80px 0; }
.cont-top .titBox { background: url("/images/sub/titBox.png") no-repeat center; background-size: cover; color:#fff; width: 45%; text-align: center;
                          padding: 6% 4.5% 4.5%; position: absolute; left:0; bottom: -50px; }
.cont-top.RM .titBox { left: inherit; bottom: inherit; top: 50%; right: 0; transform: translateY(-50%);}
.cont-top h3 { font-family: 'SBAggroB'; font-size: 2.5em; font-weight: normal; margin-bottom: 0.5em;  }
.cont-top p { line-height: 1.5em; }
.cont-top .en { font-size: 0.7em; letter-spacing: 0.1em; text-transform:uppercase; font-weight: 300; margin-bottom: 2.5em; }
.cont-top .btn_down { display: inline-block; color:#437dea; background: #fff; border-radius: 15px 0 15px 0; font-weight: 600; line-height: 3em; padding: 0 2em; }
.cont-top .btn_down:hover { color:#fff; background: #2d3290; }

.cont-top + ul,
.cont-top + div { padding-top: 50px;  }

#history_top { background-image: url("/images/sub/intro2_3_img1.png"); }
#intro1_3  { background-image: url("/images/sub/intro1_3_img1.png"); }
#intro3 { background-image: url("/images/sub/intro3_img1.png"); background-position: center bottom; }
#guide3 { background-image: url("/images/sub/guide3_img1.png"); }
#support1  { background-image: url("/images/sub/support1_img1.png"); }

@media all and (max-width:1480px) {
  .cont-top { height: 25vw; border-radius: 5vw 0 5vw 0; }
}

@media all and (max-width:1280px) {
  .cont-top .titBox  { width: auto; min-width: 50%; padding: 5% 7%; }
  .cont-top h3 { font-size: 2.2em; }
  .cont-top .en { margin-bottom: 2em; }
}

@media all and (max-width:976px) {
  .cont-top { height: 35vw; }
  .cont-top .titBox { bottom: -10vw; }
  .cont-top + ul,
  .cont-top + div { padding-top: 10vw;  }
}

@media all and (max-width:767px) {
  .cont-top {height: 38vw; border-radius: 8vw 0 8vw 0; }
  .cont-top .titBox { bottom: -14vw; }
  .cont-top h3 { font-size: 2em; }
  .cont-top + ul,
  .cont-top + div { padding-top: 14vw;  }
}

@media all and (max-width:480px) {
  .cont-top { height: auto; border-radius: 6vw 0 0 0; padding-top: 38vw; background-size: auto 38vw; }
  .cont-top .titBox { position: relative; width: 100%; bottom: inherit;; border-radius: 0 0 6vw 0; padding: 7% 5%; }
  .cont-top + ul,
  .cont-top + div { padding-top: 5%;  }
  .cont-top h3 { font-size: 1.8em; }
  .cont-top .en { margin-bottom: 1.5em; }

  .cont-top.RM .titBox { top:inherit; transform: none; }
  #intro3 { background-position: center top; }
}


#history {  position: relative; padding-left: 50px; z-index:-1; overflow: hidden; }
#history::before { content: ''; width:1px; height: 100%; background: #e0ede6; position: absolute; left:50px; top:0; margin-left: -0.5px;}
#history li { position: relative; margin-top: 5%; }
#history li::before { content:''; width: 20px; height: 20px; display: block; position: absolute; left:0; top:2.5em; margin: -10px 0 0 -10px;
                                        border-radius: 100%; background: #48c380; border: 6px solid #daf3e6; z-index:2;  }
#history li::after { content:''; width: 50px; height: 1px; display: block; background: #bfead3; z-index:1;
                                      position: absolute; left:0; top:2.5em; margin-top: -0.5px;}
#history li .txt { position: relative; overflow: hidden; padding: 2% 0 2% 7%; }
#history li .txt h4 { color: #48c380; font-size: 3.125em; font-family: 'SBAggroB'; position: relative; float: left; width: 30%;
                            line-height: 1.0em; font-weight: normal; margin-bottom: 0.7em; letter-spacing: 0; }
#history li .txt dl { float: right; width: 70%; position: relative; overflow: hidden; margin: 0 0 0.8em; }
#history li .txt dl dt { float: left; color:#212121; font-weight: 700; width: 22%; }
#history li .txt dl dd { float: left; width: 78%; }

@media all and (max-width:1480px) {
  #history li .txt h4 { font-size: 2.8em; }
}

@media all and (max-width:1280px) {
  #history li .txt h4 { font-size: 2.6em; width: 25%; }
  #history li .txt dl { width: 75%; }
}

@media all and (max-width:976px) {
  #history { padding-left: 10px; }
  #history::before { left: 10px; }
  #history li::after { width: 35px; }
  #history li .txt h4 { font-size: 2.2em; }
}

@media all and (max-width:640px) {
  #history li .txt dl dt { width: 25%; }
  #history li .txt dl dd { width: 75%; }
}

@media all and (max-width:568px) {
  #history li .txt { padding-left: 10%; }
  #history li .txt h4 { width: 100%; font-size: 2.5em; padding-left: 0.2em; }
  #history li .txt dl { width: 100%; }
}

@media all and (max-width:380px) {
    #history li .txt dl dt { width: 100%; }
    #history li .txt dl dd { width: 100%; }
}




#sMap .root_daum_roughmap .wrap_map  { height: 500px !important; }
.wrap_controllers  { display: none; }
.map_border {  display: none; }


@media all and (max-width:767px) {
  #sMap .root_daum_roughmap .wrap_map  { height: 50vw !important; }
}

@media all and (max-width:480px) {
  #sMap .root_daum_roughmap .wrap_map  { height: 60vw !important; }
}


.busRoute .img { position: relative; }
.busRoute .img img { max-width: 100%; border: 8px solid #eaf3fa; }
.busRoute .img .btn { position: absolute; right:0; bottom: 0; display: inline-block; background: #437dea; color:#fff; padding: 0 1em; line-height: 2.5em; }
.busRoute .route { padding: 20px 20px 20px 15%; background: #2d3290 url("/images/sub/ico_busBG.png") no-repeat -15px center; }
.busRoute .route .BGwh { padding: 3%; }
.busRoute .route ul li { display: inline-block; line-height: 1.8em; }
.busRoute .route ul li:last-child::after { display: none; }
.busRoute .route ul li::after { content: '\e876'; font-family:'Linearicons-Free'; font-size: 0.9em; margin: 0 0.5em; }


@media all and (max-width:767px) {
  .busRoute .route { background-size: 15% auto; }
  .busRoute .route ul li { line-height: 1.5em; }
  .busRoute .route ul li::after { margin: 0 0.3em; }
  .busRoute .route .BGwh { padding: 4% 5%; }
}


.QRcode { position: absolute; top:0; right: 0; }

@media all and (max-width:480px) {
  .QRcode img { width: 70px; }
}

@media all and (max-width:380px) {
  .QRcode { top: 5%; }
  .QRcode img { width: 50px;  }
}


.stepCont dl { position: relative; display: table; table-layout: fixed; width: 100%; padding: 3% 0; background: url("/images/common/slsline.png") repeat-x bottom; }
.stepCont dl::after { content: '\e874'; font-family:'Linearicons-Free';  position: absolute; width: 40px; height: 40px; background: #fff; color:#437dea;
                              text-align: center;  border-radius: 40px; line-height: 32px; left: 12.5%; margin-left: -20px; bottom: -20px; border: 4px solid #eaf3fa; }
.stepCont dl:last-child::after { display: none; }
.stepCont dl dt,
.stepCont dl dd { display: table-cell; vertical-align: middle; }
.stepCont dl dt { width: 25%; height: 150px; text-align:  center; border: 10px solid #eaf3fa;  padding: 4% 3%; border-radius: 30px 0 30px 0; font-size: 1.2em;
                         font-weight: 700; color:#2d3290; }
.stepCont dl dd { width: 75%; padding-left: 5%;  }


@media all and (max-width:767px) {
  .stepCont dl  { padding: 5% 0; }
}

@media all and (max-width:568px) {
  .stepCont dl::after  { left: 15%; }
  .stepCont dl dt { width: 30%; }
  .stepCont dl dd { width: 70%; }
}

@media all and (max-width:480px) {
  .stepCont dl { display: block; padding: 8% 0 5% 0; }
  .stepCont dl::after { left: 50%; }
  .stepCont dl dt,
  .stepCont dl dd { display: block; width: 100%; height: auto; }
  .stepCont dl dt { padding: 6% 4%; border-radius: 20px 0 20px 0; }
  .stepCont dl dd { padding: 5%; }
}


.stepList { position: relative; width: 100%; overflow: hidden; text-align: center; }
.stepList li { position: relative; float: left; width: calc((100% - 120px) / 3); border: 10px solid #eaf3fa;  padding: 4% 3%; border-radius: 30px 0 30px 0;
                 margin-left: 60px; }
.stepList li:first-child { margin-left:0 !important; }
.stepList li::after { content: '\e876'; font-family:'Linearicons-Free';  position: absolute; width: 40px; height: 40px; background: #fff; color:#437dea;
                              text-align: center;  border-radius: 40px; line-height: 32px; right: -60px; top: 50%; transform: translateY(-50%);
                              border: 4px solid #eaf3fa; font-weight: 700; font-size: 0.8em; z-index:99; }
.stepList li:last-child::after { display: none !important; }
.stepList li p { font-size: 1.2em; font-weight: 700; color:#2d3290; }
.stepList li dl dt { font-size: 1.125em; font-weight: 700; color:#2d3290; }
.stepList li dl dd { font-size: 0.95em; }

.stepList.col4 li { width: calc((100% - 120px) / 4); margin-left: 40px; }
.stepList.col4 li::after { right: -47px; width: 35px; height: 35px;  line-height: 27px; font-size: 0.75em; }


@media all and (max-width:1480px) {
  .stepList.col4 li { display: table; height: 160px; }
  .stepList.col4 li p,
  .stepList.col4 li dl  { display: table-cell; vertical-align: middle; }
}


@media all and (max-width:976px) {
  .stepList li { width: calc((100% - 80px) / 3); margin-left: 40px; display: table; height: 18vw;}
  .stepList li p { display: table-cell; vertical-align: middle; }
  .stepList li::after  { width: 30px; height: 30px;   line-height: 22px; right: -45px; }
}

@media all and (max-width:767px) {
    .stepList li { width: calc((100% - 20px) / 3); margin-left: 10px; }
    .stepList li p { font-size: 1.05em;  }
    .stepList li::after { right: -35px;  width: 40px; height: 40px; line-height: 32px; }

  .stepList.col4 li { width: calc((100% - 30px) / 4); margin-left: 10px;  }
  .stepList.col4 li::after { right: -35px;  width: 40px; height: 40px; line-height: 32px;  }
}

@media all and (max-width:568px) {
    .stepList li { height: 30vw; }

    .stepList.col4 li { width: calc((100% - 10px) / 2); margin-left: 10px; margin-bottom: 10px; height: 22vw; }
    .stepList.col4 li:nth-child(odd) { margin-left:0; }
    /* .stepList.col4 li:nth-child(2)::after { left: -125%; top: 22vw; transform: none; margin-top: 35px} */
    .stepList.col4 li:nth-child(even)::after { display: none; }
    .stepList.col4 li:nth-child(3)::before { content: '\e876'; font-family:'Linearicons-Free';  position: absolute; width: 40px; height: 40px; background: #fff;
                                    color:#437dea;  text-align: center;  border-radius: 40px; line-height: 32px; left: -25px; top: 50%; transform: translateY(-50%);
                                  border: 4px solid #eaf3fa; font-weight: 700; font-size: 0.8em; z-index:99; }
}

@media all and (max-width:480px) {
    .stepList.col4 li { height: 25vw; }
}

@media all and (max-width:380px) {
  .stepList li,
  .stepList.col4 li { width: 100%; margin-left:0; margin :5px 0; height: auto; padding: 5%; border-radius: 20px 0 20px 0;  }
  .stepList li::after,
  .stepList.col4 li::after { content: '\e874'; right: inherit; left: 50%; transform: none; top: inherit; bottom: -35px; margin-left: -20px; }
  .stepList.col4 li:nth-child(even)::after { display: block; }
  .stepList.col4 li:nth-child(3)::before { display: none; }
}





#organization { overflow: hidden; text-align: center; position: relative; width: 100%; font-size:0; line-height: 0; }
#organization > li { position: relative; display: block; width: 100%;   }
#organization > li > div {  position: relative; display: inline-block; width: calc(100% / 4 - 50px); height: 100px; line-height: 50px;
                                     margin: 35px 25px; }
#organization > li.depth1 > div { margin-top:0;  }
#organization > li.depth2 > div { margin-bottom:0;  }
#organization > li.depth1 > div dt { background: #1dc067; }
#organization > li.depth2 > div dt { background: #0096a3; }

#organization > li > div dl { position: relative; border-radius: 5px;  border: 1px solid #d0d6e7; overflow: hidden; background: #fff; }
#organization > li > div dl dt { font-size: 1.05rem; color:#fff; }
#organization > li > div dl dd { font-size: 0.95rem; color:#363c5a; }

#organization > li::before { content:''; width: 1px; height: 35px; background: #d0d6e7; position: absolute; left: 50%; top: -34px;  }
#organization > li > div::before { content:''; width: 1px; height: 35px; background: #d0d6e7; position: absolute; left: 50%; top: -34px; }
#organization > li.depth2::after { content: ''; width: calc(100% - (100% / 4 - 50px) - 50px); height: 1px; background: #d0d6e7;
                                            position: absolute; left: 50%; top: 0; transform: translateX(-50%); }



@media all and (max-width:1280px) {
  #organization > li > div { margin: 30px 15px; width: calc(100% / 4 - 30px); }
  #organization > li::before,
  #organization > li > div::before { height: 30px; top: -29px; }
}

@media all and (max-width:767px) {
  #organization > li > div { margin: 25px 5px; width: calc(100% / 4 - 10px); height: 80px; line-height: 40px; }
  #organization > li::before,
  #organization > li > div::before { height: 25px; top: -24px; }
  #organization > li > div dl dt { font-size: 0.95rem;  }
  #organization > li > div dl dd { font-size: 0.85rem;  }
}

@media all and (max-width:568px) {
  #organization > li > div::before,
  #organization > li.depth2::after { display: none; }
  #organization > li > div {  width: calc(100% / 2 - 14px); background: #fff; }
  #organization > li.depth2 { border: 1px dashed #d0d6e7; padding: 10px; }
  #organization > li.depth2 > div { margin:7px;  }
}

@media all and (max-width:380px) {
  #organization > li > div {  width: calc(100% / 2 - 10px); height: 70px; line-height: 35px; }
  #organization > li.depth2 > div { margin:5px;  }
  #organization > li > div dl dt { font-size: 0.9rem;  }
  #organization > li > div dl dd { font-size: 0.8rem;  }
}


.halfCont { position: relative; width: 100%; display: table; table-layout: fixed; padding: 2% 0; }
.halfCont > .half { display: table-cell; vertical-align: top; width: 50%; }
.halfCont > .half:nth-child(odd) { padding-right: 5%; }
.halfCont > .half:nth-child(even) { border-left: 1px solid #dae8ee; padding-left: 5%;  }

@media all and (max-width:767px) {
  .halfCont { display: block; }
  .halfCont > .half { display: block; width: 100%; }
  .halfCont > .half:nth-child(odd) { padding-right: 0; padding-bottom: 5%;}
  .halfCont > .half:nth-child(even) { border-left:0; border-top: 1px solid #dae8ee; padding-left: 0; padding-top: 5%; }
}


.circleCont { text-align: center; color:#fff; }
.circleCont li { position: relative; width: 260px; height: 260px; border-radius: 100%; display: inline-block; vertical-align: middle; margin-left: -30px; }
.circleCont li:first-child { margin-left:0; }
.circleCont li.blue { background: rgba(67, 125, 235, 0.9); }
.circleCont li.green { background: rgba(5, 181, 178, 0.9); }
.circleCont li dl { position: absolute; top: 30%; width: 100%; padding: 0 10% }
.circleCont li dl dt { font-size: 1.5em; font-family: 'ONE-Mobile-Title'; font-weight: normal; margin-bottom: 0.8em; padding-bottom: 0.8em;
                            border-bottom: 1px solid rgba(255,255,255,0.2)}
.circleCont li dl dd { font-size: 1.125em; }


@media all and (max-width:976px) {
  .circleCont li { width: 220px; height: 220px; }
}

@media all and (max-width:568px) {
  .circleCont li { width: 200px; height: 200px; max-width: 45vw; max-height: 45vw; margin-left: -5vw; }
}

@media all and (max-width:360px) {
  .circleCont li dl  { top: 25%; }
  .circleCont li dl dt { margin-bottom: 0.5em; padding-bottom: 0.5em; }
  .circleCont li dl dd { font-size: 1.0em; }
}


.flex{display: flex; justify-content: space-between;}
.flex .left_box{width: 48.5%;}
.flex .right_box{width: 48.5%;}

@media all and (max-width:976px){
    .flex{flex-direction: column}
    .flex .left_box{width: 100%;}
    .flex .right_box{width: 100%;}
    .flex .right_box h4{margin-top: 10%;}
}



.bustime{display:flex; gap:20px;}
.bustime li{padding:2em; width: 100%; border:6px solid #f4fafd}
.bustime li .naver{padding: 10px; text-align: center;; border:9px solid #4cb867; font-size: 18px; font-weight: 500;;}
.bustime li .naver .blink{animation:blink 1s step-end infinite ; margin-left: 5px; vertical-align: middle; display: inline-block; width: 1px; height: 17px; background-color: #000;}
.bustime li .t1{color: #4cb867;}
.bustime h5{padding: 1em; background-color: #2968df; font-size: 18px; text-align: center; border-radius: 4px;}
.bustime h5 a{color: #fff;}

@media all and (max-width:1280px){
    .bustime{flex-wrap: wrap;}
    .bustime li .naver{font-size: 16px; border-width: 8px;}
}


@keyframes blink {
    50%{opacity: 0;}
}