﻿@charset "UTF-8";
/* -- COMMON -- */
@import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@500&display=swap");
@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600;700&display=swap');

* {
 min-height: 0%
}
*, *:before, *:after {
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 -o-box-sizing: border-box;
 -ms-box-sizing: border-box;
 box-sizing: border-box
}
body {
 padding: 0;
 margin: 0
}
h1, h2, h3, h4, h5, p, em, span, figure, figcaption, dl, dt, dd {
 margin: 0;
 padding: 0
}
em, span, a {
 font-size: inherit
}
a {
 border: none;
 text-decoration: none
}
ul, li {
 list-style-type: none;
 margin: 0;
 padding: 0
}
figure {
 margin: 0;
 padding: 0
}
img {
 vertical-align: bottom
}
input, button, select, textarea {
 box-sizing: border-box;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 border: none;
 outline: none;
 max-width: 100%
}
body {
 z-index: 1
}
* {
 font-size: 16px;
 font-style: normal;
 color: #333;
 vertical-align: bottom
}
*:not(.material-icons, .min) {
 font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic ProN", "Lato", "Yu Gothic", "YuGothic", "Meiryo", メイリオ, "ＭＳ Ｐゴシック", Helvetica, Arial, sans-serif
}
*:not(.material-icons, b) {
 font-weight: 400
}
em {
 font-weight: inherit
}
.min, .min * {
 font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", 'Noto Serif JP', serif
}
.fontWs {
 font-family: "Work Sans", sans-serif;
 font-weight: 500
}
.txt {
 font-size: 16px;
 line-height: 1.8em
}
.cap {
 font-size: 10px !important;
}
.capBig,
.capBig *{
 font-size: 13px !important;
}
.indent {
 text-indent: 1em
}
a {
 transition: all .3s;
 -webkit-transition: all .3s
}
a:hover {
 opacity: .8
}
.off a {
 opacity: .5;
 pointer-events: none
}
.material-icons {
 font-size: 1.3em;
 font-family: "Material Icons"
}
.hide {
 display: none
}
sup{font-size: 80%; vertical-align: top;}
.block{display: block;}
.bold{font-weight: bold;}
@media only screen and (max-width: 767px) {
 body.fixed {
  overflow: hidden
 }
}
.txtGr, .txtGr * {
 color: #28c9b5
}
.txtGr2, .txtGr2 * {
 color: #28c9b5
}
.txtGr3, .txtGr3 * {
 color: #06a0b5
}
.txtRd, .txtRd * {
 color: #bb272d
}
.txtBu1, .txtBu1 * {
 color: #069cb1
}
.txtPk2, .txtPk2 * {
 color: #ef7171
}
@media only screen and (max-width: 767px) {
 .txt {
  font-size: 14px
 }
}
.bgGy {
 background: #f0f2f2
}
.bgWh {
 background: #fff
}
.bgGr {
 background: #28c9b5
}
.bgGr1 {
 background: #069cb1
}
.bgGr2 {
 background: #28c5b1
}
.bgGr3 {
 background: #b2e2d9
}
.mt5 {
 margin-top: 5px
}
.mt10 {
 margin-top: 10px
}
.mt15 {
 margin-top: 15px
}
.mt20 {
 margin-top: 20px
}
.mt40 {
 margin-top: 40px
}
.mt60 {
 margin-top: 60px
}
.mt100_80 {
 margin-top: 100px
}
@media only screen and (max-width: 767px) {
 .mt100_80 {
  margin-top: 80px
 }
}
.mt80_60 {
 margin-top: 80px
}
@media only screen and (max-width: 767px) {
 .mt80_60 {
  margin-top: 60px
 }
}
.mt60_40 {
 margin-top: 60px
}
@media only screen and (max-width: 767px) {
 .mt60_40 {
  margin-top: 40px
 }
}
.mt40_20 {
 margin-top: 40px
}
@media only screen and (max-width: 767px) {
 .mt40_20 {
  margin-top: 20px
 }
}
.mb10 {
 margin-bottom: 10px
}
.mb15 {
 margin-bottom: 15px
}
.mb20 {
 margin-bottom: 20px
}
.mb40 {
 margin-bottom: 40px
}
.mb80_60 {
 margin-bottom: 80px
}
@media only screen and (max-width: 767px) {
 .mb80_60 {
  margin-bottom: 60px
 }
}
.mb60_40 {
 margin-bottom: 60px
}
@media only screen and (max-width: 767px) {
 .mb60_40 {
  margin-bottom: 40px
 }
}
.mb40_20 {
 margin-bottom: 40px
}
@media only screen and (max-width: 767px) {
 .mb40_20 {
  margin-bottom: 20px
 }
}
.txtLink{text-decoration: underline; color: #0D8080;}
.core {
 max-width: 1080px;
 width: calc(100% - 40px);
 margin-left: auto;
 margin-right: auto
}
.coreMid {
 max-width: 1130px;
 width: calc(100% - 40px);
 margin-left: auto;
 margin-right: auto
}
.coreWd {
 max-width: 1200px;
 width: calc(100% - 40px);
 margin-left: auto;
 margin-right: auto
}
.coreNr {
 max-width: 940px;
 width: calc(100% - 40px);
 margin-left: auto;
 margin-right: auto
}
.flexbox {
 display: flex;
 justify-content: space-between;
 flex-wrap: wrap
}
@media only screen and (min-width: 768px) {
 .flexpc {
  display: flex;
  justify-content: space-between
 }
}
@media only screen and (max-width: 767px) {
 .flexsp {
  display: flex;
  justify-content: center
 }
}
.rv {
 flex-direction: row-reverse
}
.colL {
 order: 1
}
.colR {
 order: 2
}
.align-ct {
 text-align: center !important
}
@media only screen and (min-width: 768px) {
 .align-ctpc {
  text-align: center
 }
}
@media only screen and (max-width: 767px) {
 .align-ctsp {
  text-align: center
 }
}
.align-l {
 text-align: left !important
}
@media only screen and (min-width: 768px) {
 .align-lpc {
  text-align: left !important
 }
}
@media only screen and (max-width: 767px) {
 .align-lsp {
  text-align: left !important
 }
}
.align-r {
 text-align: right !important
}
@media only screen and (min-width: 768px) {
 .align-rpc {
  text-align: right
 }
}
@media only screen and (max-width: 767px) {
 .align-rsp {
  text-align: right
 }
}
.imgBox {
 text-align: center
}
figure {
 display: inline-block
}
figure.imgCapBox {
 position: relative
}
figure.imgCapBox figcaption {
 position: absolute;
 right: 10px;
 bottom: 10px;
 font-size: 12px;
 text-align: right;
 margin-top: .3em
}
figure.imgCapBox figcaption.wh {
 color: #fff
}
figure[class*=inCap] {
 position: relative
}
figure[class*=inCap] figcaption {
 font-size: 10px;
 color: #fff;
 margin-top: 0;
 position: absolute;
 bottom: 5px;
 right: 5px;
 left: 5px
}
figure.inCapL figcaption {
 text-align: left
}
figure.inCapR figcaption {
 text-align: right
}
img:not(.wdImg) {
 max-width: 100%
}
figure.wdImg, figure.wdImg img, img.wdImg {
 width: 100%;
 max-width: none
}
.anchor:before {
 content: "";
 display: block;
 padding-top: 65px;
 margin-top: -65px
}
header {
 z-index: 20
}
@media only screen and (min-width: 767px) {
 header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: #fff
 }
}
header .hdWrap {
 display: flex;
 justify-content: space-between;
 align-items: center;
 padding: 0 40px
}
@media only screen and (max-width: 1080px) {
 header .hdWrap {
  padding: 0 20px
 }
}
header .hdWrap .logoWrap {
 flex-basis: 255px
}
header .hdWrap .navWrap {
 flex-basis: calc(100% - 310px);
 justify-content: flex-end;
 align-items: center
}
header .hdWrap .navWrap a {
 display: block;
 text-align: center
}
header .hdWrap .navWrap nav {
 padding-right: 40px;
 justify-content: flex-end
}
header .hdWrap .navWrap nav ul {
 justify-content: flex-end
}
header .hdWrap .navWrap nav ul.parentLink > li:nth-child(n+2) {
 margin-left: 30px
}
header .hdWrap .navWrap nav ul.parentLink > li a, header .hdWrap .navWrap nav ul.parentLink > li p {
 font-size: 14px
}
header .hdWrap .navWrap nav ul.parentLink > li a {
 font-size: 14px;
 height: 100%;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center
}
header .hdWrap .navWrap nav ul li {
 position: relative
}
header .hdWrap .navWrap nav ul li.prBtn {
 cursor: pointer
}
header .hdWrap .navWrap nav ul li .childNav {
 display: none;
 position: absolute;
 top: 100%;
 left: -10px;
 right: -10px;
 background: #fff;
 border: 1px solid #28c9b5;
 border-top: none
}
header .hdWrap .navWrap nav ul li .childNav li a {
 display: flex;
 align-items: center;
 justify-content: center;
 height: 46px;
 font-size: 12px;
 font-weight: 500
}
header .hdWrap .navWrap nav ul li .childNav li:nth-of-type(n+2) {
 border-top: 1px dashed #28c9b5
}
header .hdWrap:not(.topHd) .logoWrap {
 flex-basis: 348px
}
header .hdWrap:not(.topHd) .navWrap {
 flex-basis: calc(100% - 400px)
}
header .hdWrap.topHd .logoWrap {
 flex-basis: 255px
}
header .hdWrap.topHd .navWrap {
 flex-basis: calc(100% - 310px)
}
header .hdWrap, header .menuBtnWrap {
 height: 95px
}
@media only screen and (max-width: 767px) {
 header {
  display: none
 }
 header .hdWrap, header .menuBtnWrap {
  height: 55px
 }
 header .menuBtnWrap {
  width: 73px
 }
}
@media only screen and (max-width: 767px) {
 .tglNavWrap {
  background: #fff;
  position: absolute;
  top: 70px;
  left: 0;
  right: 0
 }
}
.tglNavWrap .megaNav {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 78px;
 background: #fff;
 z-index: 35;
 overflow-y: scroll
}
.tglNavWrap .megaNav > .flexbox {
 height: 100%;
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 flex-direction: column
}
.tglNavWrap .megaNav .mainNavWrap {
 width: 86%;
 max-width: 640px
}
@media only screen and (max-width: 380px) {
 .tglNavWrap .megaNav {
  bottom: 20.5vw
 }
}
.tglNavWrap nav ul li {
 font-size: 20px
}
.tglNavWrap nav ul li a {
 font-size: inherit;
 display: block;
 opacity: 1;
 transition: all .3s;
 -webkit-transition: all .3s;
 position: relative
}
.tglNavWrap nav ul li a:hover, .tglNavWrap nav ul li a.open {
 opacity: 1
}
.tglNavWrap nav ul li .childLink {
 padding: 0 15px
}
@media only screen and (min-width: 768px) {
 .tglNavWrap nav ul li .childLink {
  display: block !important
 }
}
.spFixNav {
 z-index: 50;
 position: fixed;
 bottom: 0;
 left: 0;
 right: 0;
 background: #fff
}
.spFixNav ul {
 display: flex;
 justify-content: space-between;
 border-top: 1px solid #fff
}
.spFixNav ul li {
 flex-basis: 33.3333%;
 border-left: 1px solid #fff
}
.spFixNav ul li:nth-of-type(2) a {
 background: #28c9b5
}
.spFixNav ul li:nth-of-type(3) a {
 background: #06a0b5
}
.spFixNav ul li:nth-of-type(4) a {
 background: #009333
}
.spFixNav ul li a {
 display: block
}
.spFixNav ul li img {
 width: 100%;
 max-height: 77px
}
.spFixNav ul li.menuBtn {
 position: relative;
 background: url(../img/common/btn_spnav_01_close.svg) no-repeat 50% 50%/contain
}
.spFixNav ul li.menuBtn.active img {
 opacity: 0
}
@media only screen and (max-width: 767px) {
 .hdLogoWrap {
  position: absolute;
  top: 0;
  left: 0;
  padding: 25px 20px 40px 15px;
  background: url(../img/common/bg_logo.svg) no-repeat 0 0/contain;
  z-index: 30
 }
 .hdLogoWrap a {
  display: inline-block
 }
 .hdLogoWrap a img {
  max-width: 115px
 }
}
footer {
 padding: 60px 0 0
}
footer .logoBox a {
 display: inline-block;
 margin-bottom: 10px
}
footer nav {
 flex-wrap: wrap
}
footer nav * {
 font-size: 13px
}
footer nav .colBox:not(:first-of-type) {
 padding: 0 20px
}
footer nav .colBox:nth-of-type(2) {
 border-left: 3px solid #009333
}
footer nav .colBox:nth-of-type(3) {
 border-left: 3px solid #28c9b5
}
footer nav .colBox:nth-of-type(4) {
 border-left: 3px solid #009333
}
footer nav .colBox .prLink > li {
 margin-bottom: 15px
}
footer nav .colBox .prLink > li > a,
footer nav .colBox .prLink > li > p{
 font-weight: bold
}
footer nav .colBox .childLink li {
 margin-top: 10px
}
@media only screen and (max-width: 767px) {
 footer nav .colBox:first-of-type {
  order: 4;
  flex-basis: 100%;
  margin-top: 80px;
  text-align: center
 }
 footer nav .colBox:nth-of-type(2) {
  order: 1;
  flex-basis: 60%
 }
 footer nav .colBox:nth-of-type(3) {
  order: 3;
  flex-basis: 100%;
  margin-top: 20px
 }
 footer nav .colBox:nth-of-type(4) {
  order: 2;
  flex-basis: 40%
 }
}
footer .copyright {
 margin-top: 60px
}
footer .copyright small {
 display: block;
 font-size: 12px;
 text-align: center;
 padding: 20px 0
}
@media only screen and (max-width: 767px) {
 footer .copyright {
  margin-top: 40px
 }
 footer .copyright small {
  font-size: 10px;
  padding: 15px 0
 }
}
@media only screen and (max-width: 767px) {
 footer .megaNav .logoBox {
  text-align: center;
  margin-bottom: 40px
 }
}
.jumpTop {
 position: fixed;
 right: 27px;
 bottom: 30px;
 display: none;
 z-index: 35
}
@media only screen and (max-width: 767px) {
 .jumpTop {
  right: 15px;
  bottom: 90px
 }
}
.anchor:before {
 content: "";
 display: block;
 padding-top: 95px;
 margin-top: -95px
}
.hdLogoWrap {
 position: static;
 padding: 15px
}
.hdLogoWrap a img {
 max-width: 200px
}
.main {
 padding-bottom: 80px
}
@media only screen and (max-width: 767px) {
 .main {
  padding-bottom: 50px
 }
}
.pageTitBar {
 display: block;
 padding: 30px 0 70px;
 margin-bottom: 60px;
 text-align: center;
 background: url(../img/common/bg_titbar.svg) #eef0f0 no-repeat center bottom/90%;
 background-size: min(100%, 1116px);
 position: relative
}
.pageTitBar::after {
 content: "";
 position: absolute;
 right: calc(50% - 10px);
 bottom: 20px;
 padding: 20px 20px 0 0;
 border-bottom: 1px solid #73c3af;
 border-right: 1px solid #73c3af;
 transform: rotate(45deg)
}
.pageTitBar img {
 max-height: clamp(35px, 5vw, 62px)
}
@media only screen and (max-width: 1080px) {
 .pageTitBar {
  background: url(../img/common/bg_titbar.svg) #eef0f0 no-repeat center bottom/cover
 }
}
@media only screen and (max-width: 767px) {
 .pageTitBar {
  background: url(../img/common/bg_titbar.svg) #eef0f0 no-repeat center top/cover;
  margin-bottom: 60px;
  padding: 30px 0 60px
 }
 .pageTitBar .lowerTit02 {
  font-size: 20px
 }
 .pageTitBar .titEn {
  font-size: 16px;
  text-align: right
 }
}
.moreLink a {
 display: inline-block;
 line-height: 1em;
 font-size: 30px;
 padding: 0 0 0 80px;
 display: flex;
 text-align: left;
 align-items: center;
 height: 45px;
 background-repeat: no-repeat;
 background-position: 0 50%;
 background-size: 62px;
 background-image: url(../img/common/icon_link_gr.svg)
}
.moreLink a:hover {
 transform: translateX(15px)
}
.moreLink a p {
 font-size: inherit
}
.moreLink.gr1 a {
 background-image: url(../img/common/icon_link_gr2.svg)
}
.moreLink.gr2 a {
 background-image: url(../img/common/icon_link_gr3.svg)
}
.moreLink.wh a {
 background-image: url(../img/common/icon_link_wh.svg)
}
@media only screen and (max-width: 767px) {
 .moreLink {
  margin-top: 20px
 }
 .moreLink a {
  font-size: 30px;
  height: 35px;
  background-size: 45px;
  font-size: 16px;
  padding: 0 0 0 55px
 }
 .moreLink a:hover {
  transform: translateX(10px)
 }
}
.btnBox-01 .moreLink a {
 font-size: inherit;
 padding: 0 0 0 75px
}
.btnBox-01 .moreLink a, .btnBox-01 .moreLink a p {
 height: 38px
}
.btnBox-01 .moreLink a p {
 color: #fff;
 font-size: 17px;
 display: flex;
 align-items: center;
 width: 100%;
 padding: 0 30px;
 background: #599db1;
 border-radius: 20px
}
.btnBox-02 .moreLink a {
 font-size: inherit;
 font-weight: bold;
 padding: 0 75px;
 max-width: 720px;
 margin: 0 auto
}
.btnBox-02 .moreLink a, .btnBox-02 .moreLink a p {
 height: 65px
}
.btnBox-02 .moreLink a p {
 font-size: 34px;
 display: flex;
 align-items: center;
 justify-content: center;
 width: 100%;
 padding: 0 30px;
 background: #74c6b2;
 border-radius: 50px;
 color: #fff;
 font-weight: bold
}
@media only screen and (max-width: 767px) {
 .btnBox-02 .moreLink a {
  padding: 0 0 0 55px
 }
 .btnBox-02 .moreLink a, .btnBox-02 .moreLink a p {
  height: 45px
 }
 .btnBox-02 .moreLink a p {
  font-size: 20px;
  padding: 0 20px
 }
}
.btnBox-03 .moreLink {
 max-width: 400px;
 margin: 0 auto
}
.btnBox-03 .moreLink a {
 font-size: inherit;
 padding: 0 0 0 75px
}
.btnBox-03 .moreLink a, .btnBox-03 .moreLink a p {
 height: 46px
}
.btnBox-03 .moreLink a p {
 font-size: 21px;
 display: flex;
 align-items: center;
 width: 100%;
 padding: 0 30px;
 background: #fff;
 border-radius: 30px
}
@media only screen and (max-width: 767px) {
 .btnBox-03 .moreLink a {
  font-size: inherit;
  padding: 0 0 0 55px
 }
 .btnBox-03 .moreLink a, .btnBox-03 .moreLink a p {
  height: 32px
 }
 .btnBox-03 .moreLink a p {
  font-size: 18px;
  padding: 0 30px
 }
}
.titRow {
 align-items: center
}
.pdfLink {
 text-align: right
}
.pdfLink a {
 color: #599db1;
 text-decoration: underline;
 font-size: 14px;
 padding-right: 40px;
 position: relative;
 text-underline-offset: .3rem;
 transition: all .3s
}
.pdfLink a:hover {
 text-underline-offset: .1rem
}
.pdfLink a::after {
 position: absolute;
 right: 0;
 top: -10px;
 bottom: -10px;
 content: "";
 padding: 24px 29px 0 0;
 background: url(../img/common/icon_pdf.png) no-repeat 0 50%/contain
}
.lower-tit01 {
 display: block;
 color: #74c6b2;
 font-weight: bold;
 font-size: 36px;
 text-align: center;
 margin-bottom: 0
}
@media only screen and (max-width: 767px) {
 .lower-tit01 {
  font-size: 24px
 }
}
.lower-tit02 {
 font-size: 32px;
 margin-bottom: 40px
}
.lower-tit03 {
 font-size: 20px;
 margin-bottom: 10px
}
@media only screen and (max-width: 767px) {
 .anchor:before {
  content: none
 }
 .mvWrap {
  padding: 0 0 40px
 }
 .btnBox-01 .moreLink a {
  padding: 0 0 0 55px
 }
 .lower-tit01, .lower-tit02 {
  font-size: 22px;
  margin-bottom: 30px
 }
 .lower-tit03 {
  font-size: 16px
 }
}
.fadeIn {
 opacity: 0;
 transform: translateY(0);
 transition: all 1s
}
.fadeInUp {
 opacity: 0;
 transform: translateY(20px);
 transition: all 1s
}
.fadeInDown {
 opacity: 0;
 transform: translateY(-20px);
 transition: all 1s
}
.fadeInRight {
 opacity: 0;
 transform: translateX(20px);
 transition: all 1s
}
.fadeInLeft {
 opacity: 0;
 transform: translateX(-20px);
 transition: all 1s
}
.lodingfade {
 animation: lodingfade 1s ease both
}
@keyframes lodingfade {
 from {
  opacity: 0
 }
 to {
  opacity: 1
 }
}
@media only screen and (max-width: 767px) {
 body {
  overflow-x: hidden
 }
}
.imgL .imgCol {
 order: 1
}
.imgL .txtCol {
 order: 2
}
.imgR .txtCol {
 order: 1
}
.imgR .imgCol {
 order: 2
}
.wrapper {
 margin-top: 95px
}
@media only screen and (max-width: 767px) {
 .wrapper {
  margin-top: 0;
  padding-bottom: 20%
 }
}
.mvWrap {
 position: relative;
 z-index: 1;
 padding: 0 0 80px;
 justify-content: flex-end
}
.mvWrap .scrollDownWrap {
 position: absolute;
 z-index: 2;
 left: 35px;
 bottom: 80px
}
.mvWrap .scrollDownWrap .scrollDown {
 position: relative;
 z-index: 2;
 height: 150px
}
.mvWrap .scrollDownWrap .scrollDown::after {
 content: "";
 position: absolute;
 width: 1px;
 left: 4px;
 background: #28c9b5;
 animation: scrLine 1.4s ease-in-out infinite;
 opacity: 0
}
@keyframes scrLine {
 0% {
  height: 70px;
  bottom: 40px;
  opacity: 0
 }
 30% {
  height: 20px;
  opacity: 1
 }
 100% {
  height: 0;
  bottom: 0;
  opacity: 0
 }
}
@media only screen and (max-width: 767px) {
 .mvWrap .scrollDownWrap {
  left: 8px;
  bottom: 25px
 }
 .mvWrap .scrollDownWrap .scrollDown {
  height: 135px
 }
 .mvWrap .scrollDownWrap .scrollDown img {
  width: 6px
 }
}
.mvWrap .mvCol {
 width: calc(100% - 160px);
 margin: 0 auto
}
@media only screen and (max-width: 767px) {
 .mvWrap {
  padding: 25px;
  margin-bottom: 0
 }
 .mvWrap .mvCol {
  width: 100%
 }
}
.sliderWrap .slick-prev, .sliderWrap .slick-next {
 border-top: 1px solid #fff;
 border-right: 1px solid #fff
}
.sliderWrap .slick-prev:before, .sliderWrap .slick-next:before {
 content: none
}
.sliderWrap .slick-prev {
 transform: rotate(-135deg)
}
.sliderWrap .slick-next {
 transform: rotate(45deg)
}
.megaNav {
 display: none
}
.megaNav .logoBox {
 margin-bottom: 50px
}
.megaNav .logoBox a {
 display: inline-block;
 max-width: 255px
}
@media only screen and (max-width: 767px) {
 .megaNav {
  padding: 40px 0 40px
 }
 .megaNav .logoBox {
  max-width: 230px
 }
}
.megaNav .mainNavWrap nav {
 flex-direction: column;
  position: relative;
}
.megaNav .mainNavWrap nav .colBox ul li {
 line-height: 2em;
 font-size: 13px;
 font-weight: bold
}
.megaNav .mainNavWrap nav .colBox ul:nth-of-type(2) {
 margin-top: 30px
}
.megaNav .mainNavWrap nav .colBox ul.btnRow {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between
}
.megaNav .mainNavWrap nav .colBox ul.btnRow li a {
 display: block;
 line-height: 1.4em;
 border: 1px solid #009333;
 padding: 10px;
 color: #009333
}
@media only screen and (max-width: 767px) {
 .megaNav .mainNavWrap nav .colBox ul.btnRow li a {
  padding: 10px;
  font-size: 14px
 }
}
.megaNav .mainNavWrap nav .colBox ul.btnRow li:not(:last-of-type) {
/* flex-basis: calc((100% - 10px)/2)*/
  flex-basis: 100%;
}
.megaNav .mainNavWrap nav .colBox ul.btnRow li:not(:last-of-type) a {
 height: 100%;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center
}
.megaNav .mainNavWrap nav .colBox ul.btnRow li:first-child a {
 border: 1px solid #28c9b5;
 color: #28c9b5
}
.megaNav .mainNavWrap nav .colBox ul.btnRow li:nth-child(2) a {
 border: 1px solid #009333;
 color: #009333
}
.megaNav .mainNavWrap nav .colBox ul.btnRow li:last-of-type {
 flex-basis: 100%;
 text-align: center;
 margin-top: 10px
}
.megaNav .mainNavWrap nav .colBox ul.btnRow li:last-of-type a {
 border: 1px solid #e71e79;
 color: #e71e79
}
@media only screen and (max-width: 767px) {
 .megaNav .mainNavWrap nav .colBox ul.btnRow li {
  flex-basis: calc((100% - 10px)/2)
 }
 .megaNav .mainNavWrap nav .colBox ul.btnRow li a {
  padding: 10px;
  font-size: 14px
 }
}
.megaNav .mainNavWrap nav .colBox ul.prLink > li {
 font-size: 13px;
 margin-bottom: 10px;
 line-height: 1.5em
}
.megaNav .mainNavWrap nav .colBox ul.prLink > li > a {
 font-weight: bold
}
@media only screen and (max-width: 767px) {
  .megaNav .mainNavWrap nav .colBox ul.prLink{display: flex; width: 1005; flex-wrap: wrap;}
  .megaNav .mainNavWrap nav .colBox ul.prLink > li:nth-of-type(1){width: 100%;}
 .megaNav .mainNavWrap nav .colBox ul.prLink > li {
   width: 50%;
  font-size: min(4.2vw,16px);
  margin-bottom: 1.5em;
  line-height: 1.5em
 }
 .megaNav .mainNavWrap nav .colBox ul.prLink > li a {
  display: block
 }
}
.megaNav .mainNavWrap nav .colBox ul.childNav {
 padding: 10px 0 0
}
.megaNav .mainNavWrap nav .colBox ul.childNav li {
 flex-basis: 50%
}
@media only screen and (max-width: 767px) {
 .megaNav .mainNavWrap nav .colBox ul li {
  font-size: 16px
 }
}
.navWrapper {
 position: relative
}
.verCol {
 position: fixed;
 top: 95px;
 right: 0;
  bottom: 0;
 z-index: 30;
 transition: all .3s;
 -webkit-transition: all .3s;
  background: rgba(255,255,255,.8);
  padding: 0 30px;
}
.verCol ul {
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center
}
.verCol ul li {
 margin-bottom: 10px
}
.verCol ul li::before {
 content: "";
 display: block;
 width: 14px;
 height: 14px;
 background: #28c9b5;
 border-radius: 10px;
 filter: drop-shadow(2px 2px 3px #28C9B5)
}
.verCol ul li:nth-of-type(2)::before {
 background: #06a0b5;
 filter: drop-shadow(2px 2px 3px #06A0B5)
}
.verCol ul li:nth-of-type(3)::before {
 background: #009333;
 filter: drop-shadow(2px 2px 3px #009333)
}
.verCol ul li:nth-of-type(4)::before {
 background: #e71e79;
 filter: drop-shadow(2px 2px 3px #E71E79)
}
.verCol ul li a {
 display: inline-block;
 line-height: 1em;
 padding: 10px 0;
 letter-spacing: .3em;
 -ms-writing-mode: tb-rl;
 writing-mode: vertical-rl;
 word-break: keep-all
}

@media only screen and (min-width: 768px) and (max-height: 630px) {
    .verCol ul li a{letter-spacing: 0.1em;}
    .jumpTop{bottom: 10px;}
}

.campusSiteBnr a {
 background: url(../img/top/bg_univercity.png) no-repeat 50% 50%/cover;
 padding: 80px 10px;
 display: block;
 text-align: right
}
.campusSiteBnr a p {
 color: #fff;
 font-size: 25px;
 font-weight: bold
}
@media only screen and (max-width: 767px) {
 .campusSiteBnr a {
  background: url(../img/top/bg_univercity_sp.png) no-repeat 50% 50%/cover;
  padding: 40px 10px
 }
 .campusSiteBnr a p {
  font-size: 13px
 }
}
@media only screen and (min-width: 1081px) {
 .mdv {
  display: none !important
 }
}
@media only screen and (max-width: 1080px) {
 .wdv {
  display: none !important
 }
}
@media only screen and (min-width: 1080px) {
 .nrv {
  display: none !important
 }
}
@media only screen and (min-width: 768px) {
 .spv {
  display: none !important
 }
}
@media only screen and (max-width: 767px) {
 .pcv {
  display: none !important
 }
} /*# sourceMappingURL=common.css.map */


/* Relative Link*/
.relink{background: #ececec; padding: 30px 0; text-align: center;}
.relink .core{max-width: 1020px;}
.relinkTit{font-size: 28px; line-height: 1; color: #009333; margin-bottom: 30px;}
.relinkBnr a:hover,
.relinkBnr2 a:hover{opacity: .7;}

@media only screen and (min-width: 768px) {
  .relinkBnr{display: flex; flex-wrap: wrap; justify-content: space-between;}
  .relinkBnr li{width: 31.7%; margin: 0 2.45% 2.45% 0;}
  .relinkBnr li:nth-of-type(3n){margin-right: 0;}
  
  .relinkBnr2{display: flex; flex-wrap: wrap; justify-content: space-between;}
  .relinkBnr2 li{width: 49%;}
}

@media only screen and (max-width: 767px) {
  .relinkBnr li,
  .relinkBnr2 li{width: 100%; margin: 0 0 20px;}
  .relinkBnr img,
  .relinkBnr2 img{width: 100%;}
}

.logoBox_txt{font-weight: bold; color: #28c9b5; font-size: 18px; margin-top: 25px;}


/* Sns */
.footSns{display: flex; justify-content: space-between; width: 240px; margin: 20px 0 0 0;}
.headSns{display: flex; justify-content: space-between; width: 240px; bottom: 60px; right: 0; margin: 0; z-index: 10; margin: 0;}
@media only screen and (max-width: 767px) {
  .footSns{margin: 20px auto 0;}
}

/* Scroll SP */
.icScroll{display: none;}
@media only screen and (max-width: 767px) {
  .spScroll{overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 10px; position: relative;}
  .icScroll{position: absolute; top: 50%; left: 50%; display: flex; justify-content: center; align-items: center; background: rgba(116,198,178,.7); width: 100px; height: 60px; border-radius: 3px; margin: -30px 0 0 -50px;}
  .icScroll:after{content: ''; display: block; background: url("../img/common/ic_scroll.png") no-repeat center center/100% auto; width: 50px; height: 44px; animation: swipeLoop 2.2s infinite;}
}

@keyframes swipeLoop{
    0%{transform: translateX(-25%);}
    50%{transform: translateX(25%);}
    100%{transform: translateX(-25%);}
}
