/*
* @package WordPress
* @subpackage HGU by Santai
*/

/* eye
----------------------------------------------------------------------------------------------------*/

.carousel-indicators{display:flex; top:auto; right:0; left:0; bottom:13%; margin:auto; z-index: 1; flex-direction: row;}
.carousel-indicators li{width:13px; height:13px; border-radius: 100%; background-color:#c2c2c2;margin:0 5px 0 0;}
.carousel-indicators li:last-child{margin:0;}
.carousel-indicators .active{background-color:#999999;}
.carousel{overflow:hidden;}
.carousel > img{position: absolute; margin:0 auto; left:0; right:0; bottom:30px;max-width:10%;}
.carousel-item div{display:none;}

@media (min-width:576px) {
  .carousel-indicators{top:0; right:30px; left:auto; bottom:0; flex-direction: column;}
  .carousel-indicators li{margin:0 0 5px;}
  .carousel-item div{position: absolute; font-family: 'Oswald', sans-serif; font-weight:400; letter-spacing:.1em; font-size:3rem; color:#ffffff;top:0; left:5%; bottom:0; margin:auto; display:flex; line-height:1.1em;}
  .carousel-item:first-child div,.carousel-item:last-child div{align-items:flex-end; bottom:20%;}
  .carousel-item:nth-child(2) div{align-items:center; color:#000000;}
  .carousel-item div small{display:block; font-size:40%;}
}

/* layout
----------------------------------------------------------------------------------------------------*/
main{overflow: hidden;}
#index section h2{text-align:center; margin-bottom:0.8em; font-family: 'Oswald', sans-serif; font-weight:600;font-size: 2.5rem; letter-spacing:0.1em;}
#index section h2 small{font-family:'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif !important; display:block; font-size:45%; margin-top:5px;}

div.wrap{
  position: relative;
  padding: 60px 0px 0px;
  background-color:transparent;
}
div.wrap:before {
  content: "";
  position: absolute;
  left: 0;
  top: auto;
  width: 100%;
  height: 100%;
  -webkit-transform: skew(0, -9deg);
  -moz-transform: skew(0, -9deg);
  -ms-transform: skew(0, -9deg);
  transform: skew(0, -9deg);
  z-index:-1;
}

#index section:nth-child(odd) .wrap:before{background-color:#ffffff;}
#index section:nth-child(even) .wrap:before{background-color:#f1f1f1;}

@media (min-width:992px) {
  div.wrap{padding:3em 0}
  div.wrap:before {display:none;}
}

/* ABOUT
----------------------------------------------------------------------------------------------------*/
.about_area > div > div{padding:0 15px 20px;}
.about_area img{display:block; max-width:100%; width:100%; margin:0 auto; border-bottom:8px solid #dfdfdf;}
.about_area.color01 img{border-color:#172d80;}
.about_area.color02 img{border-color:#0d6bae;}
.about_area.color03 img{border-color:#df5f5f;}
.about_area.color04 img{border-color:#40aa4a;}
.about_area > a:hover{text-decoration:none;}
.about_area h3{text-align:center; margin-bottom: .5rem;}
@media (min-width:992px) {
  .about_area h3{text-align:left;}
  .about_area img{display:none;}
  .about {
    position: relative;
    height: 670px;
    overflow: hidden;
    background-color:transparent;
  }
  .about_area > a > figure{
    position: absolute;
    height: 375px;
    width: 50%;
    transition: all 0.5s 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
    margin: 0;
    padding: 0;
    display: block;
    list-style: none;
    background-color: transparent;
    outline: none;
  }
  .about_area > a > figure > span{
    position: absolute;
    top: 0;
    box-sizing: content-box;
    width: 100%;
    height: 100%;
    overflow: hidden;
    transition: -webkit-transform 0.5s 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: transform 0.5s 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: transform 0.5s 0.8s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.5s 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
  }
  .about_area > a > figure > span > span{
    position: absolute;
    top: 0;
    box-sizing: content-box;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    transition: -webkit-transform 0.5s 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: transform 0.5s 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
    transition: transform 0.5s 0.8s cubic-bezier(0.075, 0.82, 0.165, 1), -webkit-transform 0.5s 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);
  }
  .about_area > a > figure > span:nth-of-type(1) {overflow: hidden;}
  .about_area > a > figure > span:nth-of-type(2) {
    -webkit-transform: skewX(-11deg);
    -ms-transform: skewX(-11deg);
    transform: skewX(-11deg);
    z-index: 3;
  }
  .about_area > a > figure > span:nth-of-type(2) > span {
    -webkit-transform: skewX(11deg);
    -ms-transform: skewX(11deg);
    transform: skewX(11deg);
  }


  .about_area > a > figure > span:nth-of-type(2) > span:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    -webkit-transform: skewX(-11deg);
    -ms-transform: skewX(-11deg);
    transform: skewX(-11deg);
    width:55px;
  }

  .about_area.area_left > a > figure > span:nth-of-type(2) > span:before {right:0;}
  .about_area.area_right > a > figure > span:nth-of-type(2) > span:before {left:0;}

  .about_area.area_left > a > figure{top:0; left:0;}
  .about_area.area_left > a > figure > span {left: 0;}
  .about_area.area_left > a > figure > span > span {left: 0;}
  .about_area.area_left > a > figure > span:nth-of-type(1) > span {padding-right: 72px;}
  .about_area.area_left > a > figure > span:nth-of-type(2) {padding-left: 29px;}
  .about_area.area_left > a > figure > span:nth-of-type(2) > span {padding-right: 43px;}

  .about_area.area_right > a > figure{bottom: 0; right: 0;}
  .about_area.area_right > a > figure > span {right: 0;}
  .about_area.area_right > a > figure > span > span {right: 0;}
  .about_area.area_right > a > figure > span:nth-of-type(1) > span {padding-left: 72px;}
  .about_area.area_right > a > figure > span:nth-of-type(2) {padding-right: 29px;}
  .about_area.area_right > a > figure > span:nth-of-type(2) > span {padding-left: 43px;}

  .about_area  > div {
    position: absolute;
    width: 50%;
    height: 295px;
    transition: all 1.5s cubic-bezier(0.075, 0.82, 0.165, 1);
    display:flex;
    align-items:center;
  }
  .about_area.area_left  > div {top: 0; right: 0; justify-content:flex-start;}
  .about_area.area_right  > div {bottom: 0; left: 0; justify-content:flex-end;}

  .about_area > div > div{max-width: 495px;}
  .about_area.area_left > div > div{padding:0 30px 0 100px;}
  .about_area.area_right > div > div{padding:0 100px 0 30px;}

  .about_area.color01 > a > figure > span:nth-of-type(2) > span:before {background-color:#172d80;}
  .about_area.color02 > a > figure > span:nth-of-type(2) > span:before {background-color:#0d6bae;}
  .about_area.color03 > a > figure > span:nth-of-type(2) > span:before {background-color:#df5f5f;}
  .about_area.color04 > a > figure > span:nth-of-type(2) > span:before {background-color:#40aa4a;}

  .about_area.color01 > a > figure > span > span{background: url(../img/top_01.jpg) no-repeat top center;background-size: cover;}
  .about_area.color02 > a > figure > span > span{background: url(../img/top_02.jpg?20181226) no-repeat top center;background-size: cover;}
  .about_area.color03 > a > figure > span > span{background: url(../img/top_03.jpg) no-repeat top center;background-size: cover;}
  .about_area.color04 > a > figure > span > span{background: url(../img/top_04.jpg) no-repeat top center;background-size: cover;}

}
@media (min-width:1200px) {
  .about_area  > a > div > div{max-width:585px;}
}
.about_area h3{margin-top:0; font-weight:bold;}
.about_area.color01 h3{color:#172d80;}
.about_area.color02 h3{color:#0d6bae;}
.about_area.color03 h3{color:#df5f5f;}
.about_area.color04 h3{color:#40aa4a;}
.about_area.color01 a.btn{background-color:#172d80; border-color:#172d80;}
.about_area.color02 a.btn{background-color:#0d6bae; border-color:#0d6bae;}
.about_area.color03 a.btn{background-color:#df5f5f; border-color:#df5f5f;}
.about_area.color04 a.btn{background-color:#40aa4a; border-color:#40aa4a;}
/*
.about_area a:hover.btn{background-color:#ffffff;}
.about_area.color01 a:hover.btn{color:#0d1946;}
.about_area.color02 a:hover.btn{color:#094e7f;}
.about_area.color03 a:hover.btn{color:#d73535;}
.about_area.color04 a:hover.btn{color:#2d7935;}
*/

.about_area a.btn{cursor:pointer; border:none; color:#ffffff; padding:.3em 3em; font-family: 'Oswald', sans-serif;
-webkit-transition: all .3s;
transition: all .3s; border:1px solid #cccccc;}

#index a.btn{padding:.3em 3em; font-family: 'Oswald', sans-serif;}
#index a.btn:hover{
  -webkit-transform:scale(1.1);
  -ms-transform:scale(1.1);
  transform:scale(1.1);}
  #index a.btn-outline-default:hover,#index a.btn-default:focus,#index a.btn-default:active{background: #ffffff; border:1px solid #615796; color:#615796;}
  /*
  #index a.btn,#index button{font-size:16px; width:110px; height:30px; transition: all .5s ease-in-out; display:inline-flex; }
  #index a.btn:hover,#index a:hover button{font-size:18px;}

  CONTENTS
  ----------------------------------------------------------------------------------------------------*/
  #index div.half{display:flex; flex-direction: column;}
  #index div.half > div{min-height:0;}
  #index div.half h3{margin-top:0;}
  #index div.half h3 a{ color:#4f7eb9 !important; text-decoration:none;}
  h3::after {background-color: #4f7eb9;}
  #index div.half > div.text{padding:20px 15px;}
  @media (min-width:768px) {
    #index div.half{display:flex; align-items:center; flex-direction: row;}
    #index div.half:last-of-type{ flex-direction: row-reverse;}
    #index div.half:first-of-type > div.text{padding:20px 15px 20px 40px ;}
    #index div.half:last-of-type > div.text{padding:20px 40px 20px 15px;}
    #index div.half > div:first-child{width:50%;}
  }
  /*
  @media (min-width:576px) {
  #index div.half div.text{max-width:270px;}
}
*/
@media (min-width:768px) {
  #index div.half div.text{max-width:360px;}
}
@media (min-width:992px) {
  #index div.half div.text{max-width:480px;}
}
@media (min-width:1200px) {
  #index div.half div.text{max-width:570px;}
}

/* news_ticker
============================================================================================================ */
.news_ticker_01 {
 position:relative;
 left:.8em;
 top:-80px;
 margin-bottom:-50px;
 background:rgba(97,87,150,0.92);
 border-radius:4px;
 width:520px;
 height:50px;
 padding:0 10px;
 box-sizing:border-box;
 display:flex;
 align-items:center;
 overflow:hidden;
 z-index: 2;
}
.news_ticker_01 p {
 display:inline-block;
 color:#2e4696;
 background:#ffdd55;
 font-weight: bold;
 padding:.25em;
 width:50px;
 text-align:center;
 margin-right:10px;
 margin-top: 15px;
}
.news_ticker_01 ul {
 display: block;
 position:relative;
 height:40px;
 width:520px;
 overflow:hidden;
 margin-top: 15px;
 left: -30px;
}
.news_ticker_01 ul li {
 position:absolute;
 display:table;
 white-space:nowrap;
 height:40px;
}
.news_ticker_01 ul li a {
 font-weight: bold;
 color:#fff!important;
 display:table-cell;
 vertical-align:middle;
}
.news_ticker_01 ul li a svg {
  width:28px;
  height:35px;
  margin-right:5px;
  vertical-align:middle
}
@media screen and (max-width:991px) {
  .news_ticker_01 {
    width:445px;
  }
  .news_ticker_01 ul {
    width:445px;
  }
}
@media screen and (max-width:768px) {
  .news_ticker_01 {
    position:relative;
    left:0;
    top:0;
    margin-bottom:0;
    -webkit-border-radius:0;
    -moz-border-radius:0;
    border-radius:0;
    width:100%;
    padding:0;
    border-bottom:1px solid #bdcedf;
  }
  .news_ticker_01 p {
    background:#0184dc;
    padding:.75em 0;
  }
  .news_ticker_01 ul {
    height:40px;
    width:-webkit-calc(100% - 90px);
    width:calc(100% - 90px);
    margin-left: 10px;
  }
  .news_ticker_01 ul li {
    white-space:normal;
  }
  .news_ticker_01 ul li a {
    important;
    line-height:1.4;
  }
  .news_ticker_01 ul li a svg {
    display:none;
  }
}