@import url("https://fonts.googleapis.com/css?family=Roboto+Condensed:400+700");
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video,input,button {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  vertical-align:baseline;
  background:transparent
}
sup {
  vertical-align:super
}
sub {
  vertical-align:sub
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display:block
}
ul,
ol {
  list-style:none
}
blockquote,
q {
  quotes:none
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content:'';
  content:none
}
a {
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
  color:inherit;
  text-decoration:none;
  display:block;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  -webkit-transition:.2s;
  -o-transition:.2s;
  transition:.2s;
  cursor:pointer
}
img {
  vertical-align:bottom;
  border:none;
  width:100%
}
del {
  text-decoration:line-through
}
abbr[title],
dfn[title] {
  border-bottom:1px dotted;
  cursor:help
}
table {
  border-collapse:collapse;
  border-spacing:0
}
hr {
  display:block;
  height:1px;
  border:0;
  border-top:1px solid #cccccc;
  margin:1em 0;
  padding:0
}
input,
select {
  vertical-align:middle;
  font-size:14px
}
* {
  -webkit-box-sizing:border-box;
  box-sizing:border-box
}
html {
  font-size:.90909vw;
  overflow-y:scroll
}
@media only screen and (min-width: 1100px) {
  html {
    font-size:62.5%
  }
}
@media only screen and (max-width: 767px) {
  html {
    font-size:1.33333vw
  }
}
body {
  color:#222;
  line-height:1.8;
  font-family:'游ゴシック','Yu Gothic',YuGothic,"ヒラギノ角ゴ ProN","Hiragino Kaku Gothic ProN",sans-serif;
  word-break:break-word;
  width:100%;
  font-weight:400;
  font-size:1.6rem
}
@media only screen and (max-width: 767px) {
  body {
    font-size:2.6rem
  }
}
.container {
  overflow:hidden
}
.pc {
  display:block
}
@media only screen and (max-width: 767px) {
  .pc {
    display:none
  }
}
.sp {
  display:none
}
@media only screen and (max-width: 767px) {
  .sp {
    display:block
  }
}
.heading-xl {
  font-size:54px;
  font-weight:bold
}
@media only screen and (max-width: 767px) {
  .heading-xl {
    font-size:32px;
    font-size:8.53333vw
  }
}
.heading-l {
  font-size:36px;
  font-weight:bold
}
@media only screen and (max-width: 767px) {
  .heading-l {
    font-size:26px;
    font-size:6.93333vw
  }
}
.heading-m {
  font-size:28px;
  margin-bottom:20px;
  line-height:1.5em;
  font-weight:bold
}
@media only screen and (max-width: 767px) {
  .heading-m {
    margin-bottom:10px;
    font-size:22px;
    font-size:5.86667vw
  }
}
.heading-s {
  font-size:24px;
  font-weight:bold;
  margin-bottom:20px
}
@media only screen and (max-width: 767px) {
  .heading-s {
    margin-bottom:10px;
    font-size:18px;
    font-size:4.8vw
  }
}
.heading-xs {
  font-size:20px;
  font-weight:bold
}
@media only screen and (max-width: 767px) {
  .heading-xs {
    margin-bottom:10px;
    font-size:16px;
    font-size:4.26667vw
  }
}
.wh-txt {
  color:#fff !important
}
.btn {
  display:block;
  width:300px;
  height:65px;
  line-height:65px;
  text-align:center;
  text-decoration:none;
  outline:none;
  -webkit-transition:all 0.3s;
  -o-transition:all 0.3s;
  transition:all 0.3s;
  background-color:#234872;
  border:2px solid #234872;
  color:#fff;
  position:relative;
  font-weight:600;
  margin-top:40px;
  cursor:pointer;
  margin:60px auto 0
}
@media only screen and (max-width: 767px) {
  .btn {
    width:100%
  }
}
.btn:after {
  content:"";
  display:block;
  width:8px;
  height:8px;
  border-top:2px solid #fff;
  border-right:2px solid #fff;
  -webkit-transform:rotate(45deg);
  -ms-transform:rotate(45deg);
  transform:rotate(45deg);
  right:30px;
  position:absolute;
  -webkit-transition:0.3s;
  -o-transition:0.3s;
  transition:0.3s;
  top:calc(50% - 6px / 2)
}
.btn:hover {
  background-color:#71afd1;
  border-color:#71afd1;
  color:#fff
}
.btn:hover:after {
  right:25px
}
a img {
  -webkit-transition:0.2s;
  -o-transition:0.2s;
  transition:0.2s
}
a img:hover {
  opacity:0.7
}
.sec-in {
  max-width:1100px;
  width:90%;
  margin:0 auto 9.09091vw
}
@media only screen and (min-width: 1100px) {
  .sec-in {
    margin:0 auto 100px
  }
}
@media only screen and (max-width: 767px) {
  .sec-in {
    width:100%;
    margin:0 auto 13.33333vw;
    padding:0 5.33333vw
  }
}
.sec-in.sec-in-bg {
  padding:9.09091vw 0;
  margin:0 auto
}
@media only screen and (min-width: 1100px) {
  .sec-in.sec-in-bg {
    padding:100px 0
  }
}
@media only screen and (max-width: 767px) {
  .sec-in.sec-in-bg {
    padding:13.33333vw 5.33333vw
  }
}
.under_page section:not(:last-of-type) {
  margin-bottom:120px
}
.flex {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex
}
.f-sb {
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between
}
.f-ed {
  -webkit-box-pack:end;
  -ms-flex-pack:end;
  justify-content:flex-end
}
.f-ct {
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center
}
.f-wp {
  -ms-flex-wrap:wrap;
  flex-wrap:wrap
}
.f-ic {
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center
}
.topic-path {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  max-width:1100px;
  width:90%;
  margin:10px auto 9.09091vw
}
@media only screen and (min-width: 1100px) {
  .topic-path {
    margin-bottom:100px
  }
}
@media only screen and (max-width: 767px) {
  .topic-path {
    margin-bottom:13.33333vw;
    font-size:1rem
  }
}
.topic-path li {
  margin-right:10px;
  font-size:1.2rem;
  padding-left:15px;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  position:relative
}
@media only screen and (max-width: 767px) {
  .topic-path li {
    font-size:2.4rem
  }
}
.topic-path li:before {
  content:"";
  display:block;
  width:5px;
  height:5px;
  border-top:1px solid #333;
  border-right:1px solid #333;
  -webkit-transform:rotate(45deg);
  -ms-transform:rotate(45deg);
  transform:rotate(45deg);
  position:absolute;
  top:calc(50% - 10px / 2);
  left:0
}
.topic-path li:first-child {
  padding-left:0
}
.topic-path li:first-child:before {
  display:none
}
.topic-path li a {
  display:block;
  opacity:.5
}
.topic-path li a:hover {
  text-decoration:underline
}
.disc,
.decimal {
  margin-left:1.2em
}
.disc li,
.decimal li {
  list-style-type:disc;
  text-align:left;
  margin-bottom:10px
}
.disc li>.disc,
.disc li>.decimal,
.decimal li>.disc,
.decimal li>.decimal {
  margin:15px 0 15px 1.2em
}
.decimal li {
  list-style-type:decimal
}
.taC {
  text-align:center !important
}
.taL {
  text-align:left !important
}
@media only screen and (max-width: 767px) {
  .taL {
    text-align:center !important
  }
}
.taR {
  text-align:right !important
}
.inview {
  opacity:0;
  position:relative
}
.inview.animate {
  -webkit-animation:inview_slide_up 1.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 0s; /* 0.2s を 0s に変更 */
  animation:inview_slide_up 1.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards 0s;
}
.inview-group .inview-list,
.inview-group .inview-list2 {
  opacity:0;
  position:relative
}

/* style.css に追加: 自動でアニメーションを開始させるためのルール */
.animate-auto {
    /* 初期状態: inview_slide_up の 0% の状態を適用 */
    opacity: 0s;
    transform: translateY(12px); 
    position: relative;
}

.animate-auto {
    /* 既存の .inview-list2.animate と同じアニメーションを設定 */
    /* ここに、希望の速さ（例：0.5s の持続時間と 0.1s の遅延時間）を設定します。 */
    -webkit-animation:inview_slide_up 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards 0.1s;
    animation:inview_slide_up 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards 0.1s;
}
.inview-list2.animate-auto:nth-child(1) { animation-delay: 0s; }    /* 最初の文字は即時開始 */
.inview-list2.animate-auto:nth-child(2) { animation-delay: 0.06s; } 
.inview-list2.animate-auto:nth-child(3) { animation-delay: 0.12s; } 
.inview-list2.animate-auto:nth-child(4) { animation-delay: 0.18s; } 
.inview-list2.animate-auto:nth-child(5) { animation-delay: 0.24s; } 
.inview-list2.animate-auto:nth-child(6) { animation-delay: 0.30s; }
.inview-list2.animate-auto:nth-child(7) { animation-delay: 0.36s; }
.inview-list2.animate-auto:nth-child(8) { animation-delay: 0.42s; }
.inview-list2.animate-auto:nth-child(9) { animation-delay: 0.48s; }
.inview-list2.animate-auto:nth-child(10) { animation-delay: 0.54s; }
.inview-list2.animate-auto:nth-child(11) { animation-delay: 0.60s; }
.inview-list2.animate-auto:nth-child(12) { animation-delay: 0.66s; }
.inview-list2.animate-auto:nth-child(13) { animation-delay: 0.54s; }
.inview-list2.animate-auto:nth-child(14) { animation-delay: 0.60s; }
.inview-list2.animate-auto:nth-child(15) { animation-delay: 0.66s; }
.inview-list2.animate-auto:nth-child(16) { animation-delay: 0.72s; }
.inview-list2.animate-auto:nth-child(17) { animation-delay: 0.78s; }
.inview-list2.animate-auto:nth-child(18) { animation-delay: 0.84s; }
.inview-list2.animate-auto:nth-child(19) { animation-delay: 0.90s; }
.inview-list2.animate-auto:nth-child(20) { animation-delay: 0.96s; }
.inview-list2.animate-auto:nth-child(21) { animation-delay: 1.04s; }
.inview-list2.animate-auto:nth-child(22) { animation-delay: 1.10s; }
.inview-list2.animate-auto:nth-child(23) { animation-delay: 1.16s; }
.inview-list2.animate-auto:nth-child(24) { animation-delay: 1.24s; }
.inview-list2.animate-auto:nth-child(25) { animation-delay: 1.30s; }
.inview-list2.animate-auto:nth-child(26) { animation-delay: 1.36s; }
.inview-list2.animate-auto:nth-child(27) { animation-delay: 1.42s; }
.inview-list2.animate-auto:nth-child(28) { animation-delay: 1.48s; }
.inview-list2.animate-auto:nth-child(29) { animation-delay: 1.54s; }
.inview-list2.animate-auto:nth-child(30) { animation-delay: 1.60s; }
.inview-list2.animate-auto:nth-child(31) { animation-delay: 1.66s; }
.inview-list2.animate-auto:nth-child(32) { animation-delay: 1.72s; }
.inview-list2.animate-auto:nth-child(33) { animation-delay: 1.78s; }
.inview-list2.animate-auto:nth-child(34) { animation-delay: 1.84s; }
.inview-list2.animate-auto:nth-child(35) { animation-delay: 1.90s; }
.inview-list2.animate-auto:nth-child(36) { animation-delay: 1.96s; }
.inview-list2.animate-auto:nth-child(37) { animation-delay: 2.02s; }
.inview-list2.animate-auto:nth-child(38) { animation-delay: 2.08s; }
.inview-list2.animate-auto:nth-child(39) { animation-delay: 2.16s; }

#starkid_news {
width: 100%;
  height: 300px;
  overflow-x: hidden;  /* 水平方向は非表示（スクロール不可） */
  overflow-y: scroll;  /* 垂直方向は常にスクロールバーを表示 */
}



#starkid_news li {padding:20px;
border-bottom:1px solid #999;}

#starkid_news li dl dt {
font-weight:bold;
font-size:120%;

}


.inview-group .inview-list.animate {
  -webkit-animation:inview_slide_up 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards 0.2s;
  animation:inview_slide_up 0.7s cubic-bezier(0.4, 0, 0.2, 1) forwards 0.2s
}
.inview-group .inview-list2.animate {
  -webkit-animation:inview_slide_up 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards 0.6s;
  animation:inview_slide_up 0.5s cubic-bezier(0.4, 0, 0.2, 1) forwards 0.2s
}
@-webkit-keyframes inview_slide_up {
  0% {
    -webkit-transform:translateY(12px);
    transform:translateY(12px)
  }
  100% {
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
  }
}
@keyframes inview_slide_up {
  0% {
    -webkit-transform:translateY(12px);
    transform:translateY(12px)
  }
  100% {
    opacity:1;
    -webkit-transform:translateY(0);
    transform:translateY(0)
  }
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance:none;
  margin:0
}
input[type="number"] {
  -moz-appearance:textfield
}
input[type=submit] {
  -webkit-appearance:none
}
textarea {
  resize:none;
  width:auto;
  height:auto
}
.sec-ttl {
  font-size:5.4rem;
  margin-bottom:7.27273vw;
  color:#234872;
  text-align:center;
  font-family:'Roboto', sans-serif
}
@media only screen and (min-width: 1100px) {
  .sec-ttl {
    margin-bottom:80px
  }
}
@media only screen and (max-width: 767px) {
  .sec-ttl {
    font-size:7.2rem;
    width:100%;
    margin-bottom:10.66667vw
  }
}
.sec-ttl.wh {
  color:#fff
}
.sec-ttl.wh span {
  color:#fff
}
.sec-ttl span {
  display:block;
  font-size:1.8rem;
  margin-top:-15px;
  letter-spacing:.1em;
  color:#222
}
@media only screen and (max-width: 767px) {
  .sec-ttl span {
    margin-top:-2.66667vw;
    font-size:3.2rem
  }
}
.main-u-v {
  background:#71afd1;
  position:relative;
  width:100%;
  z-index:-1;
  height:36.36364vw
}
.main-u-v:before {
  content:"";
  background:#71afd1;
  position:absolute;
  opacity:.7;
  width:100%;
  height:100%;
  z-index:1
}
@media only screen and (min-width: 1100px) {
  .main-u-v {
    height:400px
  }
}
@media only screen and (max-width: 767px) {
  .main-u-v {
    height:53.33333vw;
    margin-top:55px
  }
}
.main-u-v .main-u-v-in {
  position:absolute;
  top:50%;
  left:50%;
  -webkit-transform:translate(-50%, -50%);
  -ms-transform:translate(-50%, -50%);
  transform:translate(-50%, -50%);
  width:100%;
  text-align:center;
  z-index:2;
  -webkit-transform:translate(-50%, -20%);
  -ms-transform:translate(-50%, -20%);
  transform:translate(-50%, -20%)
}
@media only screen and (max-width: 767px) {
  .main-u-v .main-u-v-in {
    -webkit-transform:translate(-50%, -50%);
    -ms-transform:translate(-50%, -50%);
    transform:translate(-50%, -50%)
  }
}
.main-u-v .main-u-v-in h2 {
  font-size:5.8rem;
  letter-spacing:.05em;
  font-family:'Roboto', sans-serif;
  color:#fff;
  position:relative
}
.main-u-v .main-u-v-in h2 span {
  display:block;
  font-size:2.2rem;
  margin-top:-15px;
  font-weight:500
}
@media only screen and (max-width: 767px) {
  .main-u-v .main-u-v-in h2 span {
    margin-top:-10px
  }
}
.column-2 {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  max-width:1100px;
  width:90%;
  margin:0 auto 100px
}
.main {
  width:70%
}
@media only screen and (max-width: 767px) {
  .main {
    width:100%
  }
}
.side {
  width:24%
}
@media only screen and (max-width: 767px) {
  .side {
    width:100%;
    -webkit-box-ordinal-group:3;
    -ms-flex-order:2;
    order:2;
    margin-top:10.66667vw
  }
}
.side .box h3 {
  font-weight:bold;
  line-height:1.4;
  padding:2px 0 0 10px;
  border-left:8px solid #234872;
  font-size:2.2rem;
  margin-bottom:20px
}
@media only screen and (max-width: 767px) {
  .side .box h3 {
    font-size:3.2rem
  }
}
.side .box ul {
  border:1px solid #ddd
}
.side .box ul li {
  border-bottom:1px solid #ddd
}
.side .box ul li:last-child {
  border-bottom:none
}
.side .box ul li a {
  padding:14px 0 10px 12px
}
.side .box ul li a:hover {
  -webkit-transform:translateX(7px);
  -ms-transform:translateX(7px);
  transform:translateX(7px);
  color:#71afd1
}
.pagination ul {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
  margin-top:60px
}
.pagination ul li a {
  display:inline-block;
  color:#222;
  background-color:#fff;
  text-decoration:none;
  text-align:center;
  line-height:44px;
  width:44px;
  height:44px;
  margin:0 10px;
  -webkit-transition:.2s ease-in-out;
  -o-transition:.2s ease-in-out;
  transition:.2s ease-in-out;
  white-space:nowrap;
  border:1px solid #222
}
.pagination ul li a:hover,
.pagination ul li a.current {
  background:#222;
  border:1px solid #222;
  color:#fff
}
.no-link {
  pointer-events:none
}
header {
  height:7.27273vw;
  max-width:1100px;
  top:0;
  z-index:999;
  position:fixed;
  background:#fff;
  margin:0 auto;
  left:0;
  right:0;
  -webkit-box-shadow:rgba(0,0,0,0.15) 0px 25px 50px -12px;
  box-shadow:rgba(0,0,0,0.15) 0px 25px 50px -12px
}
@media only screen and (min-width: 1100px) {
  header {
    height:80px
  }
}
@media only screen and (max-width: 767px) {
  header {
    height:55px;
    width:100%;
    position:fixed;
    -webkit-box-shadow:0 2px 10px rgba(0,0,0,0.1);
    box-shadow:0 2px 10px rgba(0,0,0,0.1)
  }
}
header .header-in {
  padding:0 0 0 30px;
  margin:0 auto;
  position:relative;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  height:100%
}
@media only screen and (max-width: 767px) {
  header .header-in {
    width:100%;
    padding:0
  }
}
header .header-in h1 {
    width:100px;
  margin-right:60px
}
@media only screen and (min-width: 1100px) {
  header .header-in h1 {
    width:150px;
  }
}
header .header-in h1 img {
  display:block;
  top:0
}
@media only screen and (max-width: 767px) {
  header .header-in h1 {
    position:fixed;
    width:80px;
    left:20px;
    top:15px
  }
}
header .header-in .header-nav {
  width:72.72727vw
}
@media only screen and (min-width: 1100px) {
  header .header-in .header-nav {
    width:800px
  }
}
@media only screen and (max-width: 767px) {
  header .header-in .header-nav {
    width:100%;
    position:absolute;
    top:55px
  }
}
@media only screen and (max-width: 767px) {
  header .header-in .header-nav>ul {
    display:none;
    background:rgba(255,255,255,0.9);
    padding:40px 20px 0;
    height:100vh
  }
}
header .header-in .header-nav>ul>li {
  position:relative;
  line-height:7.27273vw
}
@media only screen and (min-width: 1100px) {
  header .header-in .header-nav>ul>li {
    line-height:80px
  }
}
@media only screen and (max-width: 767px) {
  header .header-in .header-nav>ul>li {
    line-height:normal;
    border-bottom:1px solid #ddd
  }
}
header .header-in .header-nav>ul>li a {
  font-weight:600;
  letter-spacing:.05em;
  -webkit-transition:0.2s;
  -o-transition:0.2s;
  transition:0.2s
}
@media only screen and (max-width: 767px) {
  header .header-in .header-nav>ul>li a {
    padding:18px;
    text-align:center;
    position:relative
  }
}
header .header-in .header-nav>ul>li a:hover {
  color:#234872
}
header .header-in .header-nav>ul>li.mega-link>a {
  position:relative
}
header .header-in .header-nav>ul>li.mega-link>a:after {
  content:'';
  display:block;
  display:inline-block;
  position:absolute;
  width:7px;
  height:7px;
  top:62%;
  right:calc(50% - 7px / 2);
  vertical-align:middle;
  border-top:2px solid #234872;
  border-right:2px solid #234872;
  -webkit-transform:rotate(135deg);
  -ms-transform:rotate(135deg);
  transform:rotate(135deg)
}
@media only screen and (max-width: 767px) {
  header .header-in .header-nav>ul>li.mega-link>a:after {
    width:100%;
    width:10px;
    height:10px;
    top:calc(50% - 15px / 2);
    right:10px
  }
}
@media only screen and (max-width: 767px) {
  header .header-in .header-nav>ul>li.mega-link.open a:before {
    -webkit-transform:rotate(180deg);
    -ms-transform:rotate(180deg);
    transform:rotate(180deg)
  }
}
header .header-in .header-nav>ul>li.mega-link .mega-menu {
  position:absolute;
  width:200px;
  left:calc(50% - 200px / 2);
  display:none;
  background:#fff
}
@media only screen and (max-width: 767px) {
  header .header-in .header-nav>ul>li.mega-link .mega-menu {
    position:static;
    background:#f2f2f2;
    width:100%;
    padding:0;
    height:auto
  }
}
header .header-in .header-nav>ul>li.mega-link .mega-menu li {
  border-top:1px solid #ddd;
  height:auto;
  line-height:1.4em
}
header .header-in .header-nav>ul>li.mega-link .mega-menu li a {
  padding:15px;
  text-align:center
}
@media only screen and (max-width: 767px) {
  header .header-in .header-nav>ul>li.mega-link .mega-menu li a {
    padding:18px;
    border-bottom:none;
    position:relative
  }
}
header .header-in .header-nav>ul>li.mega-link .mega-menu li a:hover {
  color:#234872
}
header .header-in .contact-btn {
  position:absolute;
  right:-1px;
  top:0
}
header .header-in .contact-btn a {
  background-color:#234872;
  height:7.27273vw;
  line-height:7.27273vw;
  color:#fff;
  padding:0 40px;
  text-align:center;
  letter-spacing:.05em;
  -webkit-transition:.2s;
  -o-transition:.2s;
  transition:.2s
}
@media only screen and (min-width: 1100px) {
  header .header-in .contact-btn a {
    height:80px;
    line-height:80px
  }
}
@media only screen and (max-width: 767px) {
  header .header-in .contact-btn a {
    height:auto;
    line-height:normal;
    margin-top:30px
  }
}
header .header-in .contact-btn a:before {
  content:'';
  display:inline-block;
  width:20px;
  height:20px;
  background-image:url("../../assets/img/common/icon-email.svg");
  background-size:20px 20px;
  vertical-align:middle;
  margin:-3px 15px 0 0;
  -webkit-transition:.2s;
  -o-transition:.2s;
  transition:.2s
}
header .header-in .contact-btn a:hover {
  background:#71afd1;
  color:#fff !important
}
header .nav_toggle {
  display:none
}
@media only screen and (max-width: 767px) {
  header .nav_toggle {
    display:block;
    width:28px;
    height:36px;
    position:absolute;
    top:18px;
    z-index:100;
    right:16px
  }
  header .nav_toggle.open {
    top:15px
  }
  header .nav_toggle div {
    position:relative
  }
  header .nav_toggle span {
    display:block;
    height:3px;
    background:#222;
    position:absolute;
    width:100%;
    left:0;
    -webkit-transition:0.3s ease-in-out;
    -o-transition:0.3s ease-in-out;
    transition:0.3s ease-in-out
  }
  header .nav_toggle span:nth-child(1) {
    top:0
  }
  header .nav_toggle span:nth-child(2) {
    top:9px
  }
  header .nav_toggle span:nth-child(3) {
    top:18px
  }
  header .nav_toggle.open span:nth-child(1) {
    top:12px;
    -webkit-transform:rotate(135deg);
    -ms-transform:rotate(135deg);
    transform:rotate(135deg)
  }
  header .nav_toggle.open span:nth-child(2) {
    width:0;
    left:50%
  }
  header .nav_toggle.open span:nth-child(3) {
    top:12px;
    -webkit-transform:rotate(-135deg);
    -ms-transform:rotate(-135deg);
    transform:rotate(-135deg)
  }
}
.footer {
  background:#333;
  padding:60px 0;
  position:relative;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  clear:both
}
@media only screen and (max-width: 767px) {
  .footer {
    height:auto;
    padding:25px 20px
  }
}
.footer .footer-in {
  width:650px;
  margin:0 auto;
  color:#fff
}
@media only screen and (max-width: 767px) {
  .footer .footer-in {
    width:100%
  }
}
.footer .footer-in .footer-nav-upper nav {
  margin-bottom:40px
}
@media only screen and (max-width: 767px) {
  .footer .footer-in .footer-nav-upper nav ul {
    display:none
  }
}
.footer .footer-in .footer-nav-upper nav ul li {
  position:relative
}
.footer .footer-in .footer-nav-upper nav ul li a {
  -webkit-transition:0.2s;
  -o-transition:0.2s;
  transition:0.2s
}
.footer .footer-in .footer-nav-upper nav ul li a:hover {
  opacity:0.4
}
.footer .footer-in .logo {
  width:200px;
  margin:0 auto 40px
}
@media only screen and (max-width: 767px) {
  .footer .footer-in .logo {
    padding-bottom:15px;
    width:25%
  }
}
.footer .footer-in .copy-light {
  font-size:10px;
  color:#fff;
  text-align:center
}
@media only screen and (max-width: 767px) {
  .footer .footer-in .copy-light {
    margin:0 auto;
    line-height:1.4em
  }
}
.btn-to-top {
  display:none
}
.btn-to-top a {
  width:60px;
  height:60px;
  background:#333;
  position:fixed;
  right:0;
  bottom:0
}
.btn-to-top a:after {
  content:"";
  display:block;
  width:17px;
  height:17px;
  border-top:4px solid #fff;
  border-right:4px solid #fff;
  -webkit-transform:rotate(-45deg);
  -ms-transform:rotate(-45deg);
  transform:rotate(-45deg);
  position:absolute;
  top:24px;
  left:19px
}
.btn-to-top.current {
  position:absolute;
  top:-34px;
  bottom:inherit
}
#TOP .main-video {
  width:100%;
  height:100vh;
  background:-webkit-gradient(linear, left top, right bottom, from(rgba(191,240,152,0.8)), to(rgba(111,214,255,0.8)));
  background:-webkit-linear-gradient(top left, rgba(191,240,152,0.8), rgba(111,214,255,0.8));
  background:-o-linear-gradient(top left, rgba(191,240,152,0.8), rgba(111,214,255,0.8));
  background:linear-gradient(to bottom right, rgba(191,240,152,0.8), rgba(111,214,255,0.8));
  margin-bottom:0
}
#TOP .main-video .main-video-bg {
  position:absolute;
  right:0;
  bottom:0;
  min-width:100%;
  min-height:100%;
  width:auto;
  height:auto;
  z-index:-100;
  background:url("../../assets/img/poster.jpg") no-repeat
}
#TOP .main-video .main-ttl {
  position:absolute;
  top:50%;
  left:50%;
  -webkit-transform:translate(-50%, -50%);
  -ms-transform:translate(-50%, -50%);
  transform:translate(-50%, -50%);
  width:100%;
  text-align:center;
  font-size:5.6rem;
  color:#fff;
  letter-spacing:0.1em;
  line-height:1.6em;
  /*font-style:italic;*/
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
}
@media only screen and (max-width: 767px) {
  #TOP .main-video .main-ttl {
    font-size:5.2rem
  }
}
#TOP .main-video .main-ttl span {
  margin:0 -7px
}
@media only screen and (max-width: 767px) {
  #TOP .main-video .main-ttl span {
    margin:0 -5px
  }
}
#TOP .main-video .scroll {
  display:inline-block;
  position:absolute;
  right:45px;
  bottom:0;
  z-index:2;
  padding:10px 10px 110px;
  overflow:hidden;
  color:#fff;
  font-size:14px;
  font-family:'Josefin Sans', sans-serif;
  line-height:1;
  letter-spacing:.2em;
  text-transform:uppercase;
  text-decoration:none;
  -webkit-writing-mode:vertical-lr;
  -ms-writing-mode:tb-lr;
  writing-mode:vertical-lr
}
@media only screen and (max-width: 767px) {
  #TOP .main-video .scroll {
    font-size:12px;
    font-size:3.2vw;
    right:20px
  }
}
#TOP .main-video .scroll:after {
  content:'';
  position:absolute;
  bottom:0;
  left:50%;
  width:1px;
  height:100px;
  background:#fff;
  -webkit-animation:sdl 2s cubic-bezier(1, 0, 0, 1) infinite;
  animation:sdl 2s cubic-bezier(1, 0, 0, 1) infinite
}
@-webkit-keyframes sdl {
  0% {
    -webkit-transform:scale(1, 0);
    transform:scale(1, 0);
    -webkit-transform-origin:0 0;
    transform-origin:0 0
  }
  35% {
    -webkit-transform:scale(1, 1);
    transform:scale(1, 1);
    -webkit-transform-origin:0 0;
    transform-origin:0 0
  }
  35.1% {
    -webkit-transform:scale(1, 1);
    transform:scale(1, 1);
    -webkit-transform-origin:0 100%;
    transform-origin:0 100%
  }
  70%,
  100% {
    -webkit-transform:scale(1, 0);
    transform:scale(1, 0);
    -webkit-transform-origin:0 100%;
    transform-origin:0 100%
  }
}
@keyframes sdl {
  0% {
    -webkit-transform:scale(1, 0);
    transform:scale(1, 0);
    -webkit-transform-origin:0 0;
    transform-origin:0 0
  }
  35% {
    -webkit-transform:scale(1, 1);
    transform:scale(1, 1);
    -webkit-transform-origin:0 0;
    transform-origin:0 0
  }
  35.1% {
    -webkit-transform:scale(1, 1);
    transform:scale(1, 1);
    -webkit-transform-origin:0 100%;
    transform-origin:0 100%
  }
  70%,
  100% {
    -webkit-transform:scale(1, 0);
    transform:scale(1, 0);
    -webkit-transform-origin:0 100%;
    transform-origin:0 100%
  }
}
#TOP .sec01 {
  background:-webkit-gradient(linear, left top, right top, color-stop(42vw, #fff), color-stop(10%, #71afd1));
  background:-webkit-linear-gradient(left, #fff 42vw, #71afd1 10%);
  background:-o-linear-gradient(left, #fff 42vw, #71afd1 10%);
  background:linear-gradient(90deg, #fff 42vw, #71afd1 10%)
}
@media only screen and (max-width: 767px) {
  #TOP .sec01 {
    background:-webkit-gradient(linear, left top, right top, color-stop(50vw, #fff), color-stop(10%, #71afd1));
    background:-webkit-linear-gradient(left, #fff 50vw, #71afd1 10%);
    background:-o-linear-gradient(left, #fff 50vw, #71afd1 10%);
    background:linear-gradient(90deg, #fff 50vw, #71afd1 10%)
  }
}
#TOP .sec01 .sec-in>div:not(:last-of-type) {
  margin-bottom:40px
}
@media only screen and (max-width: 767px) {
  #TOP .sec01 .sec-in>div:not(:last-of-type) {
    margin-bottom:20px
  }
}
#TOP .sec01 .box {
  background:#fff;
  -webkit-box-shadow:rgba(149,157,165,0.3) 0px 8px 24px;
  box-shadow:rgba(149,157,165,0.3) 0px 8px 24px;
  padding:4.54545vw;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center
}
@media only screen and (min-width: 1100px) {
  #TOP .sec01 .box {
    padding:50px
  }
}
@media only screen and (max-width: 767px) {
  #TOP .sec01 .box {
    padding:5.33333vw
  }
}
#TOP .sec01 .box .img-area,
#TOP .sec01 .box .info-area {
  width:47%;
  text-align:justify
}
@media only screen and (max-width: 767px) {
  #TOP .sec01 .box .img-area,
  #TOP .sec01 .box .info-area {
    width:100%
  }
}
@media only screen and (max-width: 767px) {
  #TOP .sec01 .box .img-area {
    -webkit-box-ordinal-group:2;
    -ms-flex-order:1;
    order:1;
    margin-bottom:20px
  }
  #TOP .sec01 .box .info-area {
    -webkit-box-ordinal-group:3;
    -ms-flex-order:2;
    order:2
  }
}
#TOP .sec02 {
  background:rgba(48,126,183,0.1)
}
#TOP .sec02 .slider-area {
  position:relative
}
#TOP .sec02 .slider-area .slider {
  max-width:1100px;
  overflow:hidden
}
#TOP .sec02 .slider-area .swiper-button-next,
#TOP .sec02 .slider-area .swiper-button-prev {
  right:-25px;
  background-color:#234872;
  border-radius:50%;
  width:50px;
  height:50px
}
@media only screen and (max-width: 767px) {
  #TOP .sec02 .slider-area .swiper-button-next,
  #TOP .sec02 .slider-area .swiper-button-prev {
    width:36px;
    height:36px
  }
}
#TOP .sec02 .slider-area .swiper-button-prev {
  left:-25px
}
@media only screen and (max-width: 767px) {
  #TOP .sec02 .slider-area .swiper-button-prev {
    left:-15px
  }
}
@media only screen and (max-width: 767px) {
  #TOP .sec02 .slider-area .swiper-button-next {
    right:-15px
  }
}
#TOP .sec02 .slider-area .swiper-button-prev:after,
#TOP .sec02 .slider-area .swiper-button-next:after {
  border-top:4px solid #fff;
  border-right:4px solid #fff;
  -webkit-transform:rotate(225deg);
  -ms-transform:rotate(225deg);
  transform:rotate(225deg);
  width:12px;
  height:12px;
  background-size:contain;
  content:'';
  left:20px;
  position:absolute
}
@media only screen and (max-width: 767px) {
  #TOP .sec02 .slider-area .swiper-button-prev:after,
  #TOP .sec02 .slider-area .swiper-button-next:after {
    border-top:3px solid #fff;
    border-right:3px solid #fff;
    width:8px;
    height:8px;
    left:15px
  }
}
#TOP .sec02 .slider-area .swiper-button-next:after {
  -webkit-transform:rotate(45deg);
  -ms-transform:rotate(45deg);
  transform:rotate(45deg);
  left:15px
}
@media only screen and (max-width: 767px) {
  #TOP .sec02 .slider-area .swiper-button-next:after {
    left:10px
  }
}
#TOP .sec02 ul li {
  width:30.5%;
  background:#fff;
  -webkit-box-shadow:rgba(50,50,93,0.1) 0px 13px 27px -5px,rgba(0,0,0,0.1) 0px 8px 16px -8px;
  box-shadow:rgba(50,50,93,0.1) 0px 13px 27px -5px,rgba(0,0,0,0.1) 0px 8px 16px -8px
}
@media only screen and (max-width: 767px) {
  #TOP .sec02 ul li {
    width:100%
  }
  #TOP .sec02 ul li:not(:last-child) {
    margin-bottom:20px
  }
}
#TOP .sec02 ul li .info-area {
  padding:2.72727vw
}
@media only screen and (min-width: 1100px) {
  #TOP .sec02 ul li .info-area {
    padding:30px
  }
}
@media only screen and (max-width: 767px) {
  #TOP .sec02 ul li .info-area {
    padding:5.33333vw
  }
}
#TOP .sec02 ul li .info-area h4 {
  font-size:2rem;
  margin-bottom:10px
}
@media only screen and (max-width: 767px) {
  #TOP .sec02 ul li .info-area h4 {
    font-size:3.6rem
  }
}
#TOP .sec02 ul li .info-area h4+p {
  line-height:1.7em;
  text-align:justify
}
#TOP .sec03 {
  background:-webkit-gradient(linear, left top, right top, color-stop(42vw, #71afd1), color-stop(10%, #fff));
  background:-webkit-linear-gradient(left, #71afd1 42vw, #fff 10%);
  background:-o-linear-gradient(left, #71afd1 42vw, #fff 10%);
  background:linear-gradient(90deg, #71afd1 42vw, #fff 10%)
}
@media only screen and (max-width: 767px) {
  #TOP .sec03 {
    background:none
  }
  #TOP .sec03 .sec-ttl.wh {
    color:#234872;
    text-align:center;
    width:100%
  }
  #TOP .sec03 .sec-ttl.wh span {
    color:#222
  }
}
#TOP .sec03 .box {
  overflow:hidden;
  width:50%
}
@media only screen and (max-width: 767px) {
  #TOP .sec03 .box {
    width:100%;
    margin-bottom:30px
  }
}
#TOP .sec03 .box dl {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  border-bottom:1px solid #ddd;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  padding-bottom:24px;
  margin-bottom:24px
}
#TOP .sec03 .box dl:last-of-type {
  border-bottom:none;
  margin-bottom:0
}
#TOP .sec03 .box dl dt {
  width:20%;
  font-weight:bold
}
#TOP .sec03 .box dl dd {
  width:75%
}
@media only screen and (max-width: 767px) {
  #TOP .sec03 .box dl {
    padding-bottom:15px;
    margin-bottom:15px
  }
}
#TOP .sec03 iframe {
  width:100%;
  background:#fff;
  padding:30px;
  height:500px
}
@media only screen and (max-width: 767px) {
  #TOP .sec03 iframe {
    background:none;
    padding:0;
    height:300px
  }
}
#TOP .sec04 {
  background:rgba(48,126,183,0.1)
}
#TOP .sec04 .accordion-type-1 {
  width:900px;
  margin:0 auto
}
@media only screen and (max-width: 767px) {
  #TOP .sec04 .accordion-type-1 {
    width:90%
  }
}
#TOP .sec04 .accordion-type-1 dl {
  margin-bottom:2px;
  cursor:pointer
}
#TOP .sec04 .accordion-type-1 dl dt,
#TOP .sec04 .accordion-type-1 dl dd {
  padding:20px 20px 20px 30px
}
#TOP .sec04 .accordion-type-1 dl dt {
  background:#fff;
  position:relative
}
#TOP .sec04 .accordion-type-1 dl dt:after {
  content:'+';
  display:block;
  position:absolute;
  font-size:3.2rem;
  font-weight:100;
  vertical-align:middle;
  right:30px;
  color:#71afd1;
  top:7px;
  -webkit-transition:.2s;
  -o-transition:.2s;
  transition:.2s
}
#TOP .sec04 .accordion-type-1 dl dt.active:after {
  top:20px;
  -webkit-transform:rotate(45deg);
  -ms-transform:rotate(45deg);
  transform:rotate(45deg)
}
#TOP .sec04 .accordion-type-1 dl dd {
  background:#ebf2f8;
  display:none
}
#TOP .sec05 {
  background-color:rgba(48,126,183,0.1)
}
#TOP .sec05 .news-type {
  max-width:850px;
  margin:0 auto
}
@media only screen and (max-width: 767px) {
  #TOP .sec05 .news-type {
    width:100%
  }
}
#TOP .sec05 .news-type li {
  background-color:#fff
}
#TOP .sec05 .news-type li:not(:last-child) {
  margin-bottom:20px
}
@media only screen and (max-width: 767px) {
  #TOP .sec05 .news-type li:not(:last-child) {
    margin-bottom:10px
  }
}
#TOP .sec05 .news-type li a {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  padding:30px
}
#TOP .sec05 .news-type li a .time {
  vertical-align:middle;
  line-height:1.4;
  color:#888
}
#TOP .sec05 .news-type li a .cat {
  background:#333;
  display:inline-table;
  font-size:1.2rem;
  table-layout:initial;
  line-height:22px;
  height:22px;
  padding:0 5px;
  text-align:center;
  color:#fff;
  margin:-3px 10px 0
}
#TOP .sec05 .news-type li a .txt {
  width:100%;
  margin-top:10px;
  vertical-align:middle;
  display:inline-table;
  line-height:1.6;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden
}
@media only screen and (max-width: 767px) {
  #TOP .sec05 .news-type li a {
    padding:20px
  }
  #TOP .sec05 .news-type li a .time {
    width:auto;
    padding:0;
    display:inline-block
  }
  #TOP .sec05 .news-type li a .cat {
    margin:0 0 0 10px;
    width:80px;
    padding:5px 0 1px;
    line-height:1.2em;
    font-size:11px;
    font-size:2.93333vw
  }
  #TOP .sec05 .news-type li a .txt {
    margin-top:10px;
    width:100%;
    -webkit-line-clamp:2
  }
}
#TOP .sec-sub-ttl {
  font-size:3rem;
  margin-bottom:1.81818vw;
  line-height:1.4em
}
@media only screen and (min-width: 1100px) {
  #TOP .sec-sub-ttl {
    margin-bottom:20px
  }
}
@media only screen and (max-width: 767px) {
  #TOP .sec-sub-ttl {
    font-size:4rem;
    line-height:1.4em;
    margin-bottom:4vw
  }
}
#ABOUT .main-u-v {
  background:url("../../assets/img/about/kv.jpg") no-repeat center;
  background-size:cover
}
#ABOUT .sec01 .box {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center
}
#ABOUT .sec01 .box .l-area {
  width:47%
}
@media only screen and (max-width: 767px) {
  #ABOUT .sec01 .box .l-area {
    width:100%;
    -webkit-box-ordinal-group:3;
    -ms-flex-order:2;
    order:2
  }
}
#ABOUT .sec01 .box .l-area h4 {
  font-size:2.6rem;
  margin-bottom:10px
}
@media only screen and (max-width: 767px) {
  #ABOUT .sec01 .box .l-area h4 {
    font-size:4rem
  }
}
#ABOUT .sec01 .box .r-area {
  width:48%
}
@media only screen and (max-width: 767px) {
  #ABOUT .sec01 .box .r-area {
    width:100%;
    -webkit-box-ordinal-group:2;
    -ms-flex-order:1;
    order:1;
    margin-bottom:4vw
  }
}
#ABOUT .sec01 .box .r-area figcaption {
  margin-top:5px;
  text-align:center
}
#ABOUT .sec02,
#ABOUT .history-sec {
  background-color:#f6f6f6;
  margin-bottom:9.09091vw
}
@media only screen and (min-width: 1100px) {
  #ABOUT .sec02,
  #ABOUT .history-sec {
    margin-bottom:100px
  }
}
@media only screen and (max-width: 767px) {
  #ABOUT .sec02,
  #ABOUT .history-sec {
    margin-bottom:13.33333vw
  }
}
#ABOUT .sec02 dl,
#ABOUT .history-sec dl {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  border-bottom:1px solid #ddd;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  padding-bottom:28px;
  margin-bottom:28px
}
#ABOUT .sec02 dl:last-of-type,
#ABOUT .history-sec dl:last-of-type {
  border-bottom:none;
  margin-bottom:0
}
#ABOUT .sec02 dl dt,
#ABOUT .history-sec dl dt {
  width:15%;
  font-weight:bold
}
#ABOUT .sec02 dl dd,
#ABOUT .history-sec dl dd {
  width:80%
}
@media only screen and (max-width: 767px) {
  #ABOUT .sec02,
  #ABOUT .history-sec {
    width:100%
  }
  #ABOUT .sec02 dl,
  #ABOUT .history-sec dl {
    padding-bottom:20px;
    margin-bottom:20px
  }
  #ABOUT .sec02 dl dt,
  #ABOUT .history-sec dl dt {
    margin-bottom:5px
  }
  #ABOUT .sec02 dl dt,
  #ABOUT .sec02 dl dd,
  #ABOUT .history-sec dl dt,
  #ABOUT .history-sec dl dd {
    width:100%
  }
}
#ABOUT .history-sec {
  background-color:#fff
}
#ABOUT .sec03 iframe {
  width:100%;
  height:36.36364vw
}
@media only screen and (min-width: 1100px) {
  #ABOUT .sec03 iframe {
    height:400px
  }
}
@media only screen and (max-width: 767px) {
  #ABOUT .sec03 iframe {
    height:300px
  }
}
#ABOUT .sec03 iframe+p {
  text-align:center;
  margin-top:10px
}
#BUSINESS .main-u-v {
  background:url("../../assets/img/business/kv.jpg") no-repeat center;
  background-size:cover
}
#BUSINESS .box {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  max-width:1100px;
  margin:0 auto
}
#BUSINESS .box .l-area {
  width:47%
}
@media only screen and (max-width: 767px) {
  #BUSINESS .box .l-area {
    width:100%;
    -webkit-box-ordinal-group:3;
    -ms-flex-order:2;
    order:2
  }
}
#BUSINESS .box .l-area h4 {
  font-size:2.6rem;
  margin-bottom:10px
}
@media only screen and (max-width: 767px) {
  #BUSINESS .box .l-area h4 {
    font-size:4rem
  }
}
#BUSINESS .box .r-area {
  width:48%
}
@media only screen and (max-width: 767px) {
  #BUSINESS .box .r-area {
    width:100%;
    -webkit-box-ordinal-group:2;
    -ms-flex-order:1;
    order:1;
    margin-bottom:4vw
  }
}
#BUSINESS .box .r-area figcaption {
  margin-top:5px;
  text-align:center
}
#BUSINESS .even {
  background-color:#f6f6f6;
  margin-bottom:9.09091vw
}
@media only screen and (min-width: 1100px) {
  #BUSINESS .even {
    margin-bottom:100px
  }
}
@media only screen and (max-width: 767px) {
  #BUSINESS .even {
    margin-bottom:13.33333vw
  }
}
#BUSINESS .even .l-area {
  -webkit-box-ordinal-group:3;
  -ms-flex-order:2;
  order:2
}
#BUSINESS .even .r-area {
  -webkit-box-ordinal-group:2;
  -ms-flex-order:1;
  order:1
}
#PRODUCT .main-u-v {
  background:url("../../assets/img/product/kv.jpg") no-repeat center;
  background-size:cover
}
#PRODUCT .main {
  width:70%
}
@media only screen and (max-width: 767px) {
  #PRODUCT .main {
    width:100%
  }
}
#PRODUCT .main .p-list {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap
}
#PRODUCT .main .p-list:after {
  content:'';
  display:block;
  width:32%;
  height:0
}
#PRODUCT .main .p-list li {
  width:31.5%;
  background:#fff;
  -webkit-box-shadow:rgba(50,50,93,0.1) 0px 13px 27px -5px,rgba(0,0,0,0.1) 0px 8px 16px -8px;
  box-shadow:rgba(50,50,93,0.1) 0px 13px 27px -5px,rgba(0,0,0,0.1) 0px 8px 16px -8px
}
@media only screen and (max-width: 767px) {
  #PRODUCT .main .p-list li {
    width:100%
  }
  #PRODUCT .main .p-list li:not(:last-child) {
    margin-bottom:20px
  }
}
#PRODUCT .main .p-list li:nth-child(n+4) {
  margin-top:25px
}
@media only screen and (max-width: 767px) {
  #PRODUCT .main .p-list li:nth-child(n+4) {
    margin-top:auto
  }
}
#PRODUCT .main .p-list li a:hover {
  opacity:.7;
  -webkit-transition:.2s;
  -o-transition:.2s;
  transition:.2s
}
#PRODUCT .main .p-list li .info-area {
  padding:1.81818vw
}
@media only screen and (min-width: 1100px) {
  #PRODUCT .main .p-list li .info-area {
    padding:20px
  }
}
@media only screen and (max-width: 767px) {
  #PRODUCT .main .p-list li .info-area {
    padding:4vw
  }
}
#PRODUCT .main .p-list li .info-area h4 {
  font-size:1.6rem;
  line-height:1.3;
  margin-bottom:.90909vw
}
@media only screen and (min-width: 1100px) {
  #PRODUCT .main .p-list li .info-area h4 {
    margin-bottom:10px
  }
}
@media only screen and (max-width: 767px) {
  #PRODUCT .main .p-list li .info-area h4 {
    font-size:3.2rem;
    margin-bottom:1.06667vw
  }
}
#PRODUCT .main .p-list li .info-area h4+p {
  line-height:1.7em;
  font-size:1.4rem;
  text-align:justify;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden
}
@media only screen and (max-width: 767px) {
  #PRODUCT .main .p-list li .info-area h4+p {
    font-size:2.6rem
  }
}
#PRODUCT .details .p-ttl {
  font-size:3rem;
  margin-bottom:1.36364vw
}
@media only screen and (min-width: 1100px) {
  #PRODUCT .details .p-ttl {
    margin-bottom:15px
  }
}
@media only screen and (max-width: 767px) {
  #PRODUCT .details .p-ttl {
    font-size:4rem;
    margin-bottom:2.66667vw
  }
}
#PRODUCT .details .item-image {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  margin:10px 0 40px
}
@media only screen and (max-width: 767px) {
  #PRODUCT .details .item-image {
    margin-top:1.33333vw
  }
}
#PRODUCT .details .item-image li {
  width:19%
}
#PRODUCT .details .item-image li:not(:last-of-type) {
  margin-right:1.25%
}
#PRODUCT .details .item-image li.current {
  opacity:.7
}
#PRODUCT .details dl:not(:last-of-type) {
  margin-bottom:40px
}
#PRODUCT .details dl dt {
  font-weight:bold;
  line-height:1.4;
  padding:2px 0 0 10px;
  border-left:8px solid #234872;
  font-size:2.2rem;
  margin-bottom:15px
}
@media only screen and (max-width: 767px) {
  #PRODUCT .details dl dt {
    font-size:3.2rem
  }
}
#NEWS .main-u-v {
  background:url("../../assets/img/news/kv.jpg") no-repeat center;
  background-size:cover
}
#NEWS .main {
  width:70%
}
@media only screen and (max-width: 767px) {
  #NEWS .main {
    width:100%
  }
}
#NEWS .main .n-list1 {
  margin-bottom:100px
}
#NEWS .main .n-list1 li {
  border-bottom:1px solid #ddd
}
#NEWS .main .n-list1 li:first-child {
  border-top:1px solid #ddd
}
#NEWS .main .n-list1 li a {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  padding:25px 0
}
#NEWS .main .n-list1 li a .time {
  vertical-align:middle;
  line-height:1.4
}
#NEWS .main .n-list1 li a .cat {
  background:#333;
  display:inline-table;
  font-size:1.2rem;
  table-layout:initial;
  padding:1px 5px 0;
  text-align:center;
  color:#fff;
  margin:-3px 20px 0
}
#NEWS .main .n-list1 li a .txt {
  width:100%;
  vertical-align:middle;
  display:inline-table;
  line-height:1.6;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:1;
  overflow:hidden;
  margin-top:10px
}
@media screen and (max-width: 767px) {
  #NEWS .main .n-list1 li a {
    padding:20px 0
  }
  #NEWS .main .n-list1 li a .time {
    width:auto;
    padding:0;
    display:inline-block
  }
  #NEWS .main .n-list1 li a .cat {
    margin:0 0 0 10px;
    padding:3px 5px 1px;
    line-height:1.4em;
    font-size:2rem
  }
  #NEWS .main .n-list1 li a .txt {
    margin-top:10px;
    width:100%;
    -webkit-line-clamp:2
  }
}
#NEWS .main .n-list2 {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap
}
#NEWS .main .n-list2:after {
  content:'';
  display:block;
  width:32%;
  height:0
}
#NEWS .main .n-list2 li {
  width:31.5%;
  background:#fff;
  -webkit-box-shadow:rgba(50,50,93,0.1) 0px 13px 27px -5px,rgba(0,0,0,0.1) 0px 8px 16px -8px;
  box-shadow:rgba(50,50,93,0.1) 0px 13px 27px -5px,rgba(0,0,0,0.1) 0px 8px 16px -8px
}
@media only screen and (max-width: 767px) {
  #NEWS .main .n-list2 li {
    width:100%
  }
  #NEWS .main .n-list2 li:not(:last-child) {
    margin-bottom:20px
  }
}
#NEWS .main .n-list2 li:nth-child(n+4) {
  margin-top:25px
}
@media only screen and (max-width: 767px) {
  #NEWS .main .n-list2 li:nth-child(n+4) {
    margin-top:auto
  }
}
#NEWS .main .n-list2 li a:hover {
  opacity:.7;
  -webkit-transition:.2s;
  -o-transition:.2s;
  transition:.2s
}
#NEWS .main .n-list2 li .info-area {
  padding:1.81818vw
}
@media only screen and (min-width: 1100px) {
  #NEWS .main .n-list2 li .info-area {
    padding:20px
  }
}
@media only screen and (max-width: 767px) {
  #NEWS .main .n-list2 li .info-area {
    padding:4vw
  }
}
#NEWS .main .n-list2 li .info-area h4 {
  font-size:1.6rem;
  line-height:1.3;
  margin-bottom:.90909vw
}
@media only screen and (min-width: 1100px) {
  #NEWS .main .n-list2 li .info-area h4 {
    margin-bottom:10px
  }
}
@media only screen and (max-width: 767px) {
  #NEWS .main .n-list2 li .info-area h4 {
    font-size:3.2rem;
    margin-bottom:1.06667vw
  }
}
#NEWS .main .n-list2 li .info-area .info-head {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  font-size:1.4rem;
  margin-bottom:10px
}
@media only screen and (max-width: 767px) {
  #NEWS .main .n-list2 li .info-area .info-head {
    font-size:2.4rem
  }
}
#NEWS .main .n-list2 li .info-area .info-head .time {
  color:#888;
  margin-right:10px
}
#NEWS .main .n-list2 li .info-area .info-head .cat {
  background-color:#333;
  color:#fff;
  padding:4px 6px 2px;
  font-size:1.2rem;
  line-height:1;
  display:block;
  margin-top:-2px
}
@media only screen and (max-width: 767px) {
  #NEWS .main .n-list2 li .info-area .info-head .cat {
    font-size:2rem
  }
}
#NEWS.details .info-head {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  margin-bottom:10px
}
#NEWS.details .info-head .time {
  color:#888;
  margin-right:10px
}
#NEWS.details .info-head .cat {
  background-color:#333;
  color:#fff;
  padding:4px 6px 2px;
  font-size:1.2rem;
  line-height:1;
  display:block;
  margin-top:-2px
}
@media only screen and (max-width: 767px) {
  #NEWS.details .info-head .cat {
    font-size:2rem
  }
}
#NEWS.details .n-ttl {
  font-size:3rem;
  margin-bottom:1.36364vw
}
@media only screen and (min-width: 1100px) {
  #NEWS.details .n-ttl {
    margin-bottom:15px
  }
}
@media only screen and (max-width: 767px) {
  #NEWS.details .n-ttl {
    font-size:4rem;
    margin-bottom:2.66667vw
  }
}
#NEWS.details .item-main-img {
  margin-bottom:40px
}
#NEWS.details dl:not(:last-of-type) {
  margin-bottom:40px
}
#NEWS.details dl dt {
  font-weight:bold;
  line-height:1.4;
  padding:2px 0 0 10px;
  border-left:8px solid #234872;
  font-size:2.2rem;
  margin-bottom:15px
}
@media only screen and (max-width: 767px) {
  #NEWS.details dl dt {
    font-size:3.2rem
  }
}
#RECRUIT .main-u-v {
  background:url("../../assets/img/recruit/kv.jpg") no-repeat center;
  background-size:cover
}
#RECRUIT .sec01 {
  margin-bottom:9.09091vw
}
@media only screen and (min-width: 1100px) {
  #RECRUIT .sec01 {
    margin-bottom:100px
  }
}
@media only screen and (max-width: 767px) {
  #RECRUIT .sec01 {
    margin-bottom:13.33333vw
  }
}
#RECRUIT .sec01 .sec-in {
  max-width:850px
}
#RECRUIT .sec01 .r-list dl {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  border-bottom:1px solid #ddd;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  padding-bottom:28px;
  margin-bottom:28px
}
#RECRUIT .sec01 .r-list dl:last-of-type {
  border-bottom:none;
  margin-bottom:0
}
#RECRUIT .sec01 .r-list dl dt {
  width:15%;
  font-weight:bold
}
#RECRUIT .sec01 .r-list dl dd {
  width:80%
}
@media only screen and (max-width: 767px) {
  #RECRUIT .sec01 .r-list {
    width:100%
  }
  #RECRUIT .sec01 .r-list dl {
    padding-bottom:20px;
    margin-bottom:20px
  }
  #RECRUIT .sec01 .r-list dl dt {
    margin-bottom:5px
  }
  #RECRUIT .sec01 .r-list dl dt,
  #RECRUIT .sec01 .r-list dl dd {
    width:100%
  }
}
#RECRUIT.interview .sec-in {
  max-width:1100px
}
#RECRUIT.interview .box {
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  margin-bottom:60px
}
#RECRUIT.interview .box .l-area {
  width:45%
}
@media only screen and (max-width: 767px) {
  #RECRUIT.interview .box .l-area {
    width:100%;
    -webkit-box-ordinal-group:2;
    -ms-flex-order:1;
    order:1
  }
}
#RECRUIT.interview .box .r-area {
  width:55%;
  padding:4.54545vw;
  background-color:#234872;
  color:#fff
}
@media only screen and (min-width: 1100px) {
  #RECRUIT.interview .box .r-area {
    padding:50px
  }
}
@media only screen and (max-width: 767px) {
  #RECRUIT.interview .box .r-area {
    width:100%;
    -webkit-box-ordinal-group:3;
    -ms-flex-order:2;
    order:2
  }
}
#RECRUIT.interview .box .r-area h4 {
  font-size:2.6rem;
  margin:5px 0
}
@media only screen and (max-width: 767px) {
  #RECRUIT.interview .box .r-area h4 {
    font-size:4rem
  }
}
#RECRUIT.interview .box .r-area h4 .department {
  font-size:1.8rem;
  display:inline-block;
  margin-left:15px;
  font-weight:normal
}
#RECRUIT.interview .box .r-area .joined {
  color:rgba(255,255,255,0.5);
  margin-bottom:1.81818vw;
  display:block
}
@media only screen and (min-width: 1100px) {
  #RECRUIT.interview .box .r-area .joined {
    margin-bottom:20px
  }
}
#RECRUIT.interview .box .r-area .joined+p {
  font-size:1.8rem;
  font-weight:bold
}
@media only screen and (max-width: 767px) {
  #RECRUIT.interview .box .r-area .joined+p {
    font-size:3.2rem
  }
}
#RECRUIT.interview dl:not(:last-of-type) {
  margin-bottom:40px
}
#RECRUIT.interview dl dt {
  font-weight:bold;
  line-height:1.4;
  padding:2px 0 0 10px;
  border-left:8px solid #234872;
  font-size:2.2rem;
  margin-bottom:15px
}
@media only screen and (max-width: 767px) {
  #RECRUIT.interview dl dt {
    font-size:3.2rem
  }
}
#CONTACT .main-u-v {
  background:url("../../assets/img/contact/kv.jpg") no-repeat center;
  background-size:cover
}
#CONTACT .sec-in {
  max-width:850px
}
#CONTACT .input_area dl {
  border-bottom:1px solid #eee;
  margin-bottom:30px;
  padding-bottom:30px;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center
}
#CONTACT .input_area dl dt {
  width:300px;
  text-align:left;
  line-height:1.5;
  font-weight:500
}
#CONTACT .input_area dl dt .dt_width {
  width:16.36364vw;
  display:inline-block
}
@media only screen and (min-width: 1100px) {
  #CONTACT .input_area dl dt .dt_width {
    width:180px
  }
}
#CONTACT .input_area dl dt .required {
  color:#fff;
  background:#f00000;
  padding:5px 5px 3px;
  text-align:center;
  font-size:12px
}
#CONTACT .input_area dl dd {
  width:70%
}
@media screen and (max-width: 767px) {
  #CONTACT .input_area {
    width:100%
  }
  #CONTACT .input_area dl {
    margin-bottom:20px;
    padding-bottom:20px;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap
  }
  #CONTACT .input_area dl dt {
    width:auto;
    margin-bottom:10px
  }
  #CONTACT .input_area dl dt .dt_width {
    width:auto
  }
  #CONTACT .input_area dl dt .required {
    padding:3px 4px 2px;
    font-size:10px;
    font-size:2.66667vw;
    margin-left:10px
  }
  #CONTACT .input_area dl dd {
    width:100%
  }
}
#CONTACT .input_area input[type="text"],
#CONTACT .input_area input[type="email"],
#CONTACT .input_area input[type="tel"],
#CONTACT .input_area input[type="number"],
#CONTACT .input_area input[name="zip"] {
  width:100%;
  height:50px;
  line-height:50px;
  background:#f4f4f4;
  border:0;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  padding:0 1em;
  outline:none;
  font-size:1.6rem
}
#CONTACT .input_area input::-webkit-input-placeholder {
  color:#bbb;
  font-size:1.6rem
}
#CONTACT .input_area input:-ms-input-placeholder {
  color:#bbb;
  font-size:1.6rem
}
#CONTACT .input_area input::-ms-input-placeholder {
  color:#bbb;
  font-size:1.6rem
}
#CONTACT .input_area input::placeholder {
  color:#bbb;
  font-size:1.6rem
}
@media only screen and (max-width: 767px) {
  #CONTACT .input_area input::-webkit-input-placeholder {
    font-size:2.8rem
  }
  #CONTACT .input_area input:-ms-input-placeholder {
    font-size:2.8rem
  }
  #CONTACT .input_area input::-ms-input-placeholder {
    font-size:2.8rem
  }
  #CONTACT .input_area input::placeholder {
    font-size:2.8rem
  }
}
#CONTACT .input_area textarea {
  width:100%;
  height:160px;
  background:#f4f4f4;
  line-height:1.4em;
  border:none;
  padding:1em;
  outline:none
}
#CONTACT .input_area .select_box {
  width:auto;
  margin-bottom:15px;
  background:#f4f4f4;
  overflow:hidden;
  text-align:center;
  position:relative
}
#CONTACT .input_area .select_box::before {
  position:absolute;
  top:calc(50% - 12px / 2);
  right:20px;
  content:'';
  border-left:8px solid transparent;
  border-right:8px solid transparent;
  border-top:12px solid #000;
  pointer-events:none
}
#CONTACT .input_area .select_box select {
  height:50px;
  line-height:54px;
  width:100%;
  padding-right:1em;
  cursor:pointer;
  -o-text-overflow:ellipsis;
  text-overflow:ellipsis;
  border:none;
  outline:none;
  background:transparent;
  background-image:none;
  -webkit-box-shadow:none;
  box-shadow:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  padding:0 38px 0 20px;
  color:#333
}
#CONTACT .input_area .select_box select::-ms-expand {
  display:none
}
#CONTACT .input_area .half {
  width:50%
}
@media only screen and (max-width: 767px) {
  #CONTACT .input_area .half {
    width:100%
  }
}
#CONTACT .privacy_area {
  height:300px;
  border:1px solid #f2f2f2;
  padding:40px;
  text-align:left;
  overflow-y:scroll;
  line-height:1.6em;
  letter-spacing:0.05em;
  margin:65px 0 40px
}
@media screen and (max-width: 767px) {
  #CONTACT .privacy_area {
    padding:20px
  }
}
#CONTACT .privacy_area h4 {
  font-size:2.2rem;
  margin:20px 0 15px
}
@media only screen and (max-width: 767px) {
  #CONTACT .privacy_area h4 {
    font-size:4rem
  }
}
#CONTACT .privacy_area dt {
  font-weight:bold;
  margin-top:1em
}
#CONTACT .privacy_area dd {
  margin-top:0.5em
}
#CONTACT .privacy_area .establishment {
  text-align:right;
  margin-top:50px
}
#CONTACT .agree_check {
  text-align:center
}
#CONTACT .btn input[type="submit"] {
  color:#fff
}
#CONTACT .thanks_sec {
  margin:0 0 15vh
}
@media only screen and (max-width: 767px) {
  #CONTACT .thanks_sec {
    margin:0 0 15vh
  }
}
#CONTACT .thanks_sec h2 {
  font-size:30px;
  text-align:center;
  margin-bottom:30px
}
@media only screen and (max-width: 767px) {
  #CONTACT .thanks_sec h2 {
    font-size:24px;
    font-size:6.4vw;
    margin-bottom:20px
  }
}
#CONTACT .thanks_sec h2+p {
  text-align:center;
  font-size:18px
}
@media only screen and (max-width: 767px) {
  #CONTACT .thanks_sec h2+p {
    font-size:16px;
    font-size:4.26667vw;
    margin-bottom:40px
  }
}
#CONTACT .thanks_sec h2+p span {
  display:block;
  font-size:14px;
  margin-top:10px
}
@media only screen and (max-width: 767px) {
  #CONTACT .thanks_sec h2+p span {
    font-size:12px;
    font-size:3.2vw
  }
}




/* メインビジュアルスライダー */
#TOP .main-video {
  position: relative;
  width: 100%;
  height: 80vh;
  overflow: hidden;
  margin-bottom: 0;
}

/* グラデーションオーバーレイ（常に表示） */
#TOP .main-video::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom right, rgba(191,240,152,0.3), rgba(111,214,255,0.3));
  z-index: 1;
  pointer-events: none;
}

#TOP .main-video .main-slider {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

#TOP .main-video .main-slider .swiper-slide {
  width: 100%;
  height: 100%;
}

#TOP .main-video .main-slider .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#TOP .main-video .main-ttl {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
  font-size: 5rem;
  color: #fff;
  letter-spacing: 0.03em;
  line-height: 1.6em;
  /*font-style: italic;*/
  z-index: 2;
}

@media only screen and (max-width: 767px) {
  #TOP .main-video .main-ttl {
    font-size: 4rem;
  }
}

#TOP .main-video .main-ttl span {
  margin: 0 -7px;
}

@media only screen and (max-width: 767px) {
  #TOP .main-video .main-ttl span {
    margin: 0 -5px;
  }
}

#TOP .main-video .scroll {
  display: inline-block;
  position: absolute;
  right: 45px;
  bottom: 0;
  z-index: 2;
  padding: 10px 10px 110px;
  overflow: hidden;
  color: #fff;
  font-size: 14px;
  font-family: 'Josefin Sans', sans-serif;
  line-height: 1;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  writing-mode: vertical-lr;
}

@media only screen and (max-width: 767px) {
  #TOP .main-video .scroll {
    font-size: 12px;
    font-size: 3.2vw;
    right: 20px;
  }
}

#TOP .main-video .scroll:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 1px;
  height: 100px;
  background: #fff;
  animation: sdl 2s cubic-bezier(1, 0, 0, 1) infinite;
}


/* アンカーリンク用のオフセット調整 */
#BUSINESS [id] {
  scroll-margin-top: 100px;
}

@media only screen and (max-width: 767px) {
  #BUSINESS [id] {
    scroll-margin-top: 70px;
  }
}


/* アンカーリンク用のオフセット調整 */
#unit01,
#unit02,
#unit03,
#unit04 {
  scroll-margin-top: 100px;
}

@media only screen and (max-width: 767px) {
  #unit01,
  #unit02,
  #unit03,
  #unit04 {
    scroll-margin-top: 70px;
  }
}