@charset "UTF-8";



.mobile-break {
    display: none;
}

@media only screen and (max-width: 768px) {
    .mobile-break {
        display: block;
    }
    .mobile-hide {
        display: none!important;
        width:300px;
        height: 300px;
    }
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
body, h1, h2, h3, h4, h5, h6, p, ol, ul, dl, dt, dd, img, figure, fieldset, form, label, legend, button, input, textarea, menu {
    margin: 0;
    padding: 0;
    border: 0;
}
/*
body, html {
    overflow-x: hidden!important;
}*/

body {
    line-height: 1.55;
    color: #565654;
    font-feature-settings: "palt";
    /*font-family: 'M PLUS Rounded 1c', sans-serif;*/
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
    font-weight: 500;
    font-size: 18px;
    background:#fff;
    position: relative;
}

ol, ul {
    list-style: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

a {
    text-decoration: none;
    color: inherit; /* リンクの色を継承 */
}

button, input, textarea, select {
    font-family: inherit; /* フォントの継承を強制 */
    font-size: 100%; /* フォントサイズを継承 */
}

button, input[type="submit"], input[type="button"], input[type="reset"] {
    cursor: pointer;
    background-color: transparent; /* ボタンの背景色を透明に */
    -webkit-appearance: none; /* ベンダープレフィックスでのスタイルをリセット */
    appearance: none; /* OSデフォルトのスタイルをリセット */
}




/*cookie control*/
.overlaycookie {
    display: none;
    position: fixed;
    z-index: 999!important;
    height: 70px;
    width: 100%;
    color: #fff;
    bottom: 0;
    font-size:16px;
    font-weight:400;
}
.btn_area {
    position: absolute;
    color: #fff;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.8);
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.btn_area_child {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 900px;
    padding: 17px 0;
}
.btn_area_child div:first-child {
    flex: 1;
    padding-right:20px;
}
.btn_area_child div a {
    color: #fff !important;
    text-decoration: underline;
}
.btn_area button.btn {
    color: #fff;
    border: none;
    padding: 5px 15px;
}
.btn_area button.btn:hover {
    text-decoration: underline;
}

@media (max-width: 576px) {
    .overlaycookie {
        height: 190px;
    }
    .btn_area_child {
        flex-direction: column;
        width: 100%;
        padding: 17px;
    }
    .btn_area_child div:first-child {
        padding:20px 0 10px 0;
    }
    .btn_area button.btn {
        width: 250px;
    }
}


@media only screen and (max-width: 991px) {
    .block-menu-btn {
        visibility: visible;
        display: flex;
    }
    header {
        visibility: hidden;
        display: none;
    }
}


/* ナビゲーション */
.navbar-container, .nav-container {
    /*background-color:#3280e0;*/
    display: flex;
    justify-content: center; /* 中央揃えのための設定 */
}
.nav-container {
    background-color:#fff;
    height: 90px;
}
.navbar, .nav-content {
    width: 100%;
    max-width: 1366px;
    display: flex;
    justify-content: space-between;
    align-items: center;	
    padding: 10px;
}
.navbar {
	color:#3280e0;
}
.nav-content {
	margin:20px 0;
}
.navbar .left-side, .navbar .right-side, .nav-menu {
    display: flex;
    align-items: center;
}
.navbar .left-side div:first-child, .nav-menu div:not(:last-child) {
	margin-right:40px;
}
.navbar .right-side div {
	margin-right:40px;
}
.navbar .right-side div:nth-last-child(2) {
    margin-right:20px;
}
.nav-menu div {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.nav-menu .fa-sort-down-solid,.nav-menu .dummy-icon {
    display: block;
    margin-top:0px;
    visibility: visible;
    height: 1em; /* Font Awesomeアイコンのデフォルトの高さ。変更が必要な場合は調整してください */
}
.nav-menu .dummy-icon {
    visibility: hidden;
}
.navbar .right-side div:last-child, .nav-menu div:last-child {
	margin-right:0;
}

.dropdown {
    position: relative;
}
.dropdown-content {
    position: absolute;
    top: 75%;
    left: 0; /* 左端に配置するための指定 */
    background-color: #f9f9f9;
    width: 230px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 999;
    display: none!important;
    padding: 20px 0px;
}
.dropdown:hover .dropdown-content {
    display: block!important;
}
.dropdown-content a {
    display: block;
    padding:0 20px;
    margin-bottom: 20px;
    transition: background-color 0.2s, color 0.2s; /* 追加: ホバー時のアニメーション */
}
.dropdown-content a:last-child {
    margin-bottom: 0px;
}
.dropdown-content a:hover {
    background-color: #3280e0; /* ホバー時の背景色 */
    color: #ffffff;            /* ホバー時の文字色 */
}

/* 固定されたときのスタイル */
.nav-container.fixed {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 900;
  height: 90px!important;
  box-shadow: 0 1px 6px 0 rgba(0,0,0,0.2);
}
.main-visual.fixed2 {
  margin-top:0px;
}

@media only screen and (max-width: 991px) {
    .main-visual.fixed2 {
      margin-top:0px;
    }
}



a.text-hover-w {
    color: #fff!important;
}
a.text-hover {
    color: #565654; /* 元のテキストの色 */
    text-decoration: none;
    position: relative;
    transition: all 0.2s ease-in-out;
    display: inline-block; /* 追加: ブロック要素としての振る舞いを持たせる */
}
a.text-hover:hover {
    color: #3280e0; /* ホバー時の色を少し明るくする */
    transform: translateY(-2px); /* ホバー時に少し上に移動 */
}
a.text-hover-white {
    color: #ffffff; /* 通常時のテキストの色を白に */
    text-decoration: none;
    position: relative;
    transition: all 0.2s ease-in-out;
    display: inline-block; /* 追加: ブロック要素としての振る舞いを持たせる */
}
a.text-hover-white:hover {
    color: #ffffff; /* ホバー時もテキストの色を白に */
    transform: translateY(-2px); /* ホバー時に少し上に移動 */
}

.btn {
    display: inline-block;
    padding: 10px 35px;
    border-radius: 50px;
    background-color:#fff;
    color: #3280e0;
    text-decoration: none;
    transition: all 0.3s ease-in-out; /* 複数のプロパティのアニメーションを追加 */
    position: relative;
    overflow: hidden; /* オーバーフローの制御 */
    text-align: center;
}
.btn:hover {
    /*color: #e35a80;*/
    transform: scale(1.05); /* ホバー時にやや拡大 */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); /* ホバー時のピンクの影の追加 */
}
.btn-white {
    background: #fff;
    color: #3280e0;
    /*border: 2px solid #e35a80;*/ /* 枠線を追加 */
}


.block-menu-btn {
    visibility: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    position: fixed;
    z-index: 998;
    width: 100%;
    height: 42px;
    top: 0;
    margin-top:0;
  }
  .block-menu-btn .logo {
    flex-grow: 1;
    font-weight:400;
    font-size: 18px;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-left:10px;
    letter-spacing:-.8px;
  }
  .block-menu-btn .navi {
    display: flex;
    align-items: center;
  }
  .block-menu-btn .box-lang {
    margin-right: 1rem;
    margin-top: 4px;
  }
  
  .block-menu-btn .menu-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #3280e0;
    flex-grow: 0;
    padding:5px 9px 0;
    height: 44px;
  }
  .block-menu-btn .menu-btn .menu {
    margin-top:1px;
    font-size:10px;
    color:#fff;
  }
  .fixed {
    position: fixed;
    width: 100%;
    height: 100%;
  }
  .menu-trigger, .menu-trigger span {
    display: inline-block;
    transition: all .4s;
    box-sizing: border-box;
  }
  .menu-trigger {
    position: relative;
    width: 32px;
    height: 24px;

  }
  .menu-trigger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 4px;
    background-color: #ffffff; /* ここを変更してバーガーメニューを白に */
    border-radius: 4px;
  }
  .menu-trigger span:nth-of-type(1) {
    top: 0;
  }
  .menu-trigger span:nth-of-type(2) {
    top: 10px;
  }
  .menu-trigger span:nth-of-type(3) {
    bottom: 0;
  }
  .menu-trigger.active span:nth-of-type(1) {
    transform: translateY(10px) rotate(-45deg);
  }
  .menu-trigger.active span:nth-of-type(2) {
    opacity: 0;
  }
  .menu-trigger.active span:nth-of-type(3) {
    transform: translateY(-10px) rotate(45deg);
  }
  
  .burger-navi .overlay {
    position: fixed;
    top: 0;
    z-index: 997;
    display: none;
    width: 100%;
    height: 100%;
    background: #3280e0;
    padding-top: 42px;
    display: none;
    font-size:20px;
    overflow-y: auto;
  }
  .burger-navi .menu-sp {
    width: 100%;  /* max-width を削除して、width 100% を設定 */
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .burger-navi .nav-sp {
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid #fff;
    padding: 15px 1.2rem;
    text-decoration: none;
    color: #fff;
    width:100%;
  }
  .burger-navi .nav-sp:hover {
    background: #fff;
    color: #3280e0;
  }
  .burger-navi .btn-sp-contact {
    margin-top: 30px;
    width: 290px!important;
  }
  .burger-navi .accordion-item {
      width: 100%;
  }
  .burger-navi .accordion-content {
      width: 100%;
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease-out;
  }
  .burger-navi .icon-sns {
    padding:20px 0 50px 0;
  }
  .burger-navi .icon-sns a {
    font-size:16px;
    color:#fff;
  }
  .accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    display: flex;          /* Flexboxを有効化 */
    flex-direction: column; /* 子要素を縦方向に並べる */
    align-items: center;    /* 縦位置を中央に */
    }
.accordion-content a {
    width: 100%;            /* 横幅を100%に */
    background-color: #fff; /* 背景を白色に */
    text-align: center;     /* テキストを中央揃え */
    padding: 10px 0;        /* 上下のパディングを追加 */
    border-bottom: 1px solid #eee; /* オプション：境界線を追加 */
}
.accordion-content a:hover {
    background-color: #f5f5f5; /* 薄いグレー色に */
}
.accordion-content a:last-child {
    border-bottom: none;    /* 最後のアイテムの境界線を削除 */
}
.accordion-content.open {
    max-height: 500px;
}
.accordion-item .fa-sort-down-solid {
    margin-left: 5px;  /* 右に少し移動 */
    vertical-align: middle; /* 垂直方向の位置調整 */
    transform: translateY(-2px); /* 縦位置を少し上に */
}
.burger-navi .btn {
    width:320px;
    text-align:center;
}
.phone-info {
    margin-top: 20px;
    padding: 10px;
    display: flex;        /* フレックスボックスを適用 */
    flex-direction: column; /* フレックスボックスの方向を縦に設定 */
    align-items: center;  /* アイテムを中央に配置 */
    gap: 20px;           /* アイテム間のスペースを設定 */
    color: #fff;
    font-size: 18px;
}
.phone-number, .business-hours {
    display: flex;
    align-items: center;
    margin: 8px 0;
}
.phone-number span, .business-hours span {
    margin-right: 10px;
    color: #fff; /* アイコンの色 */
}
.phone-info {
    margin-top: 20px;
    padding: 10px;
    display: flex;        /* フレックスボックスを適用 */
    flex-direction: column; /* フレックスボックスの方向を縦に設定 */
    align-items: center;  /* アイテムを中央に配置 */
    gap: 20px;           /* アイテム間のスペースを設定 */
    color: #fff;
}

.phone-number, .business-hours {
    display: flex;
    align-items: center;
    margin: 0px 0;  /* マージンを20pxに設定 */
}
.business-hours {
    margin-top:-20px;
}

.phone-number span, .business-hours span {

    color: #fff; /* アイコンの色 */
}

.phone-number {
    font-size: 1.5em; /* フォントサイズを大きく設定。適宜調整してください */
}
@media only screen and (max-width: 1034px) {
    .block-menu-btn {
        visibility: visible;
        display: flex;
    }
}



/* CTA */
/*
.cta {
    text-align: center;
    background:#f2eee9;
    padding:80px 0;
}
.cta h2 {
    margin-bottom:60px;
    line-height:1.15;
    font-size:40px;
}
.btn-container {
    display: flex;
    justify-content: center;
    gap: 40px;
}
.cta-btn {
    width: 300px;
    height: 300px;
    display: block;
}
@media only screen and (max-width: 991px) {
    .cta rt {
	    top:5px;
	    transform: translateY(5px);
        display: none;
    }
    .cta {
        padding:20px 0;
    }
    .cta h2 {
        margin-bottom:30px;
        line-height:1.35!important;
        font-size:22px!important;
        padding:0 10px;
    }
    .cta rt {
        font-size:10px!important;
    }
    .cta .btn-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 20px;
    }
}
*/


/* footer */
footer {
    background:#3280e0;
    color:#fff;
    text-align:center;
    font-weight:500;
    padding-bottom:20px;
    padding-top: 100px;
}
footer .wrap-footer {
    display: flex;
    width:1100px;
    margin:0 auto;
    text-align:left;
    margin-bottom:100px;
}
footer .wrap-footer .left {
    flex:1;
    margin-right:25px;
}
footer .wrap-footer .right {
    flex:1;
    padding-top: 113px;
    margin-left:25px;
}
footer .wrap-footer .left img {
    width:300px;
    margin-bottom: 40px;
}
address {
    font-style: normal;
}
footer .wrap-footer .map {
    margin-top: 10px;
}

footer .wrap-footer .right .contact-num {
    display:flex;
    margin:30px 0 20px;
}
footer .wrap-footer .right .contact-num span {
    font-size: 27px;
    padding-left:10px;
}
footer .wrap-footer .right .contact-num-right {
    margin-left:20px;
}
footer .wrap-footer .right .btn {
    width: 100%;
}

.wrap-footer-navi .box1, .wrap-footer-navi .box2, .wrap-footer-navi .box3, .wrap-footer-navi .box4 {
flex:1;
}
.wrap-footer-navi .navi-L {
font-size:20px;
font-weight: bold;
margin-bottom:30px;
}
.wrap-footer-navi p {
margin-bottom:20px;
}
.lang-footer {
margin-top:30px;
}
.box4 {
font-weight:bold;
}

@media only screen and (max-width: 991px) {
    footer {
      margin-top:50px;
      padding:40px 15px 20px!important;
      font-size:16px;
    }
    footer .wrap-footer {
      display:block;
      width:100%;
      margin-bottom:30px;
    }
    footer .wrap-footer .left {
      margin-right:0px;
    }
    footer .wrap-footer .right {
      padding-top:50px;
      margin-left:0px;
    }
    footer .wrap-footer .left img {
      width:150px;
      margin-bottom: 20px;
    }
    footer .wrap-footer .right p {
      font-weight:bold;
    }
    footer .wrap-footer .right .contact-num {
      display:block;
      margin:30px 0 10px;
    }
    footer .wrap-footer .right .contact-num span {
      font-size: 27px;
      padding-left:10px;
    }
    footer .wrap-footer .right .contact-num-right {
      margin-left:0px;
    }

    .wrap-footer-navi .box1, .wrap-footer-navi .box2, .wrap-footer-navi .box3, .wrap-footer-navi  .box4 p {
      display: none;
      visibility: hidden;
    }
    .wrap-footer-navi .lang-footer {
      width: 100%;
      margin-top:50px;
    }
    
    .wrap-footer-navi .lang-footer img {
      width:30px;
    }
}




	
/* トップ  */

.js-text-slide-in,
  .js-text-mask-wrap {
    line-height: 0;
  }
  .js-text-mask {
    line-height: 1;
    overflow: hidden;
  }
  .js-text-mask span span {
    display: inline-block;
    transform: translateY(100%);
    visibility: hidden;
  }

  .no-scroll {
    overflow: hidden;
  }

  .background {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    background-color:#fff;
    height: 100%;
    z-index: 1000;
}
.logo {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2000;
}
.main-visual {
    margin-bottom:150px;
    position:relative;
  }
  .main-visual img {
    width:100%;
    height:auto;
  }
  @media only screen and (max-width: 991px) {
    .main-visual {
      margin-bottom:100px;
      position:relative;
    }
  }

.xx {
    width:auto;
    height:155px;
    background:#3280e0;
    line-height:1.35;
    color:#fff;
    position:absolute;
    z-index:40;
    top:260px;
    right: 0px;
    padding:10px 0;
    overflow: hidden;
  }
  .text-mask {
    overflow: hidden;
  }
  .text-mask span {
    padding: 10px 0px 10px 15px;
    font-family: "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
    font-size: 50px;
    transform: translateY(100%);
    visibility: hidden;
  }
  .xx span span {
    display: inline-block;
    padding:0;
  }
  @media only screen and (max-width: 991px) {
    .xx {
      height:140px;
      top:202px;
      padding:10px 0;
    }
    .text-mask span {
      padding: 10px 0px 10px 0px;
      font-size: 30px;
    }
  }

.movie .wrap-movie {
    display:flex;
    justify-content: space-between;
    align-items: center;
    width:85%;
    max-height: 1000px;
    margin:0 auto;
    margin-top: 30px;
  }
  .wrap-movie .left {
    flex: 5.0;
  }
  .wrap-movie .right {
    flex: 5.0;
    margin-left:30px;
  }
  .wrap-movie .left img {
    width:100%;
    box-shadow: 0 0px 8px rgba(0, 0, 0, 0.3);
  }

  .wrap-movie .right h2 {
    font-weight:500;
    color:#3280e0;
    font-size:36px!important;
  }
  .wrap-movie .right h3 {
    font-weight:500;
    line-height: 1.75;
    margin:20px 0 30px;
    font-size:18px;
  }
  .wrap-movie .right a {
    font-size:18px;
    color:#3280e0;
  }
  @media only screen and (max-width: 991px) {
    .movie p {
      display:none;
    }
    .movie {
      padding:0 15px;
    }
    .movie .wrap-movie {
      display:block;
      width:100%;
    }
    .wrap-movie .left {

      flex: 5.0;
    }
    .wrap-movie .right {
      flex: 5.0;
      margin-left:0px;
      margin-top:20px;
    }
    .wrap-movie .right h2 {
      font-size:30px!important;
    }
    .wrap-movie .right h3, .wrap-movie .right a {
      font-size:16px;
    }
  }


  .name-container {
    display: flex;
    width: 100%;
    position: relative;
    margin-top: -100px;
    overflow: hidden;
  }
  .name-wrap {
    white-space: nowrap;
    width: 100%;
  }
  .name-wrap-right {
    position: absolute;
    left: 100vw;
  }
  .name-text {
    margin: 0;
    padding: 0;
    position: relative;
    font-weight:100;
    color: #e6e6e6;
    width: 100%;
    text-align: center;
    font-size: 8.2vw;
    white-space: nowrap;
    overflow: hidden;
    display:block;
    letter-spacing:-2px;
  }



#top .product {
    margin-top: 200px;
    background:#3280e0;
    padding:0px;
    position: relative;
  }
  #top .bg-white-upper {
    position: absolute;
    height: 50px;
    width: 100%;
    background-image: url("/assets2023/img/bg-white.png");
    background-repeat: repeat-x;
  }
  #top .bg-white-bottom {
    position: absolute;
    height: 50px;
    width: 100%;
    bottom:-20px;
    background-image: url("/assets2023/img/bg-white.png");
    background-repeat: repeat-x;
  }
  #top .wrap-product {
    display:flex;
    align-items: center;
    width:1100px;
    margin:0 auto;
  }
  #top .wrap-product .left {
    color:#fff;
    padding-right:40px;
  }
  #top .wrap-product h2 {
    font-weight:100;
    font-size:80px!important;
    margin-left:-7px!important;
  }
  #top .wrap-product h2 .js-text-mask{
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  #top .wrap-product h2 .sub {
    font-size:26px;
    font-weight: 300;
    display: block;
    padding-left:7px;
  }
  #top .wrap-product p {
    margin:100px 0;
  }
  #top .wrap-product .right {
    margin-left:0px;
  }
  #top .wrap-product .slideshow {
    position: relative;
    overflow: hidden;
    height: 719px;
    width:520px;
  }
  #top .wrap-product .slide {
    position: absolute;
    top: 0;
    left: 0px;
    z-index: 100;
  }


  @media only screen and (max-width: 991px) {
    #top .product {
      font-size:16px;
      margin-top: 50px;
      padding:50px 15px 0;
    }
    #top .bg-white-upper, #top .bg-white-bottom {
      display: none;
    }
    #top .wrap-product {
      display:block;
      width:100%;
    }
    #top .wrap-product .left {
      padding-right:0px;
    }
    #top .wrap-product h2 {
      font-size:30px!important;
      margin-left:0px!important;
    }
    #top .wrap-product h2 .sub {
      font-size:22px;
      display: block;
      padding-left:0px;
    }
    #top .wrap-product p {
      margin:30px 0;
      padding:0;
    }
    #top .wrap-product .right {
      margin-top:30px;
    }
    #top .wrap-product .slideshow {
      position: relative;
      overflow: hidden;
      height: 440px;
      width:280px;
    }
    #top .wrap-product .slideshow img {
      width: 100%;
      height: auto;
    }

  }






.program {
    margin-top:80px;
    padding-top: 80px;
  }
  #top .program .side-scroll {
    display: flex;
    justify-content: center;
    align-items: center;

  }
  .program .container {
    width: 100%;
    max-width: 1166px;
    margin: 0 auto;
  }
  .program h2 {
    color:#3280e0;
    font-weight:100;
    font-size:80px!important;
    margin-bottom: 50px;
  }
  .wrap-product h2 .js-text-mask{
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  .program h2 .sub {
    font-size:26px;
    font-weight: 400;
    display: block;
    margin-top: 20px;
  }

  #top .program .side-scroll-list-wrapper {
    position: relative;
    width: 100%;
    height: 460px;
    margin-top:80px;
    margin-left:-25px;
  }
  #top .program .side-scroll-list {
    position: absolute;
    top: 0px;
    left: 0;
    display: flex;
    gap: 0 0px;
  }
  #top .program .side-scroll-item {
    display: flex;
    justify-content: center;
    width: 900px;
    height: 360px;
    align-items: stretch;
    flex-direction: row;
  }
  #top .program .side-scroll-item .main-img {
    margin-right: 0px;
  }

  #top .program .side-scroll-text {
    display: flex;
    flex-direction: column;
    justify-content: flex-end!important;
    padding-bottom: 10px;
    height: 100%;
  }
  #top .program .side-scroll-text h3 {
    font-size:26px;
    color:#3280e0;
    padding:5px 0px 5px 20px;
    font-weight:500;
  }
  #top .program .side-scroll-text p {
    font-weight:500;
    margin-top:20px;
    padding-left: 20px;
  }
  #top .program .side-scroll-text a span {
    color: #e35a80;
  }
  #top .program .side-scroll-item + .side-scroll-item {
    margin-left: 80px;
  }

  .program a {
    color:#3280e0;
    margin-top:20px;
    display:block;
    padding-left: 20px;
    text-decoration: none;
  }


@media only screen and (max-width: 991px) {
    .program {
      margin-top:0px;
      padding-top: 0px;
      padding-left:15px;
      padding-right:15px;
      font-size: 16px;
    }
    .program h2 {
      font-size:30px!important;
      margin-bottom: 10px;
      margin-top:0!important;
      padding:0!important;
      padding-top:40px!important;
      font-size:30px!important;
      letter-spacing: -1.6px;
    }
    .program h2 .sub {
      font-size:22px;
    }
    #top .program .side-scroll-list-wrapper {
        margin-left: 0px!important;
        margin-top: 0px;
        height: 400px;
    }
    #top .program .side-scroll-list {
        position: absolute;
        top: 10px;
        left: 0;
        display: flex;
        gap: 0 0px;
    }
    #top .program .side-scroll-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 280px;
        height: 350px;
    }
    #top .program .side-scroll-item:last-child {
        margin-right: 50px!important;
    }
    #top .program .side-scroll-item .main-img {
        width: 100%;
        padding-left: 10px;
    }
    #top .program .side-scroll-item .mini-img {
        width: 30px;
        margin:0;
        padding:0;
    }

    #top .program .side-scroll-text {
        display: flex;
        flex-direction: column; 
        align-items: flex-start;
        text-align: left;
        padding: 0 0px;
        margin-top:0;
    }
    #top .program .side-scroll-text h3 {
        font-size:24px;
        margin-top:5px;
    }
    #top .program .side-scroll-text p {
        font-weight:500;
        margin-top:10px;
    }
    #top .program .side-scroll-text a {
        text-decoration: none;
        font-weight:500;
        margin-top:10px;
    }
    #top .program .side-scroll-item .main-img {
        padding-left: 0px;
    }

    #top .program .side-scroll-item + .side-scroll-item {
        margin-left: 20px;
    }
}


/* 代表あいさつ */
#company .header {
    width: 1100px;
    margin:0 auto;
    margin-top:70px;
    margin-bottom:100px;
  }

  .js-text-slide-in,
  .js-text-mask-wrap {
    line-height: 0;
  }
  .js-text-mask {
    line-height: 1;
    overflow: hidden;
  }
  .js-text-mask span span {
    display: inline-block;
    transform: translateY(100%);
    visibility: hidden;
  }
  #company .header h2 {
    color:#3280e0;
    font-weight:100;
    font-size:80px!important;
    /* line-height: 1.35; */
    margin-left:-7px!important;
  }
  #company .header h2 .js-text-mask{
    /* line-heightの代わり */
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  #company .header h2 .sub {
    font-size:26px;
    font-weight: 300;
    display: block;
    padding-left:7px;
  }
  @media only screen and (max-width: 991px) {
    #company .header {
      width: 100%;
      margin-top:80px;
      margin-bottom:70px;
      padding:0 15px;
    }
    #company .header h2 {
      font-weight:100;
      font-size:30px!important;
      /*line-height: 1.35;*/
      margin-left:0px!important;
    }
    #company .header h2 .sub {
      font-size:16px;
      padding-left:0px;
    }
  }


.wrapper {
  width: 1100px;
  margin:0 auto;
  display: flex;
  justify-content: space-between;
  padding-bottom: 140px;
}
.main {
  width: calc(100% - 260px);
}
.sidebar {
  width: 250px;
  font-size:22px;
  font-weight: 300  ;
}
.sidebar a {
  display: block;
  margin-bottom:30px;
}
.sidebar a.current {
  color:#3280e0;
  pointer-events: none;
  cursor: default;
}
.sidebar a i {
  color:#3280e0;
  padding-right: 10px;
}
.widget {
  height: 260px;
  margin-bottom: 20px;
  background-color:transparent;
}
.widget:last-child {
  margin-bottom: 0;
}
.widget--sticky {
  position: sticky;
  top: 140px;
}
#company h3 {
  font-size: 46px;
  font-weight:200;
  color:#3280e0;
  margin-bottom: 40px;
}
#company h4 {
  font-size: 30px;
  font-weight:200;
  color:#3280e0;
  border: 1px solid #3280e0;
  padding:5px 20px;
  display: inline-block;
  margin-top: 80px;
}
.wrapper strong {
  display: block;
  margin-top: 30px;
  font-size:30px;
  font-weight:600;
}
.wrapper p {
  margin-top: 30px;
  line-height: 1.85;
}
.wrapper p.name {
  margin-top: 60px;
}



@media only screen and (max-width: 991px) {
  .wrapper {
    width: 100%;
    margin:0 auto;
    display: block;
    padding:0 15px;
  }
  .main {
    width:100%;
  }
  .sidebar {
    width:100%;
    font-size:20px;
    font-weight: 300;
  }
  .sidebar a {
    margin-bottom:15px;
  }
  .sidebar a:last-child {
    margin-bottom:0;
  }
  .widget {
    height: auto;
    margin-bottom:0px;
    padding-bottom: 60px;
    background-color:transparent;
  }
  #company h3 {
    font-size: 30px;
    margin-bottom: 10px;
  }
  .wrapper p {
    margin-top: 20px;
  }
  .wrapper p.name {
    margin-top: 40px;
  }
}


.company-profile {
    display:flex;
    margin-top:50px;
  }
  .company-profile .left {
    flex:1;
    text-align-last:justify;
    padding-right: 100px;
  }
  .company-profile .right {
    flex:5;
  }
  .company-profile .map a {
    color:#3280e0!important;
  }
  .company-profile strong {
    margin-top:0;
    margin-bottom:10px;
    font-size:20px;
  }
  .company-profile ol li {
    list-style-type: disc;
    line-height: 1.85;
    margin-left: 20px;
  }
  .company-profile .second {
    margin-top: 40px;
  }
  .company-profile .member {
    display:flex;
    margin-bottom: 10px;
  }
  .company-profile .member:last-child {
    margin-bottom: 0px;
  }
  .company-profile .member .title {
    flex:1;
  }
  .company-profile .member .name {
    flex:2;
  }

  @media only screen and (max-width: 991px) {
    .company-profile {
      display:block;
      margin-top:40px;
    }
    .company-profile .left {
      width:100%;
      text-align-last:left;
      padding-right:0px;
      font-weight:bold;
    }
    .company-profile .right {
      width:100%;
    }
    .company-profile strong {
      margin-top:10px;
      font-size:20px;
      line-height:1.15!important;
    }
    .company-profile .member {
      display:block;
      margin-top: 10px;
    }
    .company-profile .member .title {
      width:100%;
      font-weight:bold;
    }
    .company-profile .member .name {
      width:100%;
    }
  }





#product .header {
    width: 1100px;
    margin:0 auto;
    margin-top:70px;
    margin-bottom:100px;
  }
  #product .js-text-slide-in,
  #product .js-text-mask-wrap {
    line-height: 0;
  }
  #product .js-text-mask {
    line-height: 1;
    overflow: hidden;
  }
  #product .js-text-mask span span {
    display: inline-block;
    transform: translateY(100%);
    visibility: hidden;
  }
  #product .header h2 {
    color:#3280e0;
    font-weight:100;
    font-size:80px!important;
    margin-left:-7px!important;
  }
  #product .header h2 .js-text-mask{
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  #product .header h2 .sub {
    font-size:26px;
    font-weight: 300;
    display: block;
    padding-left:7px;
  }
  @media only screen and (max-width: 991px) {
    #product .header {
      width: 100%;
      margin-top:80px;
      margin-bottom:70px;
      padding:0 15px;
    }
    #product .header h2 {
      font-size:30px!important;
      margin-left:0px!important;
    }
    #product .header h2 .sub {
      font-size:22px;
      display: block;
      padding-left:0px;
    }
  }



#product h3 {
  font-size: 46px;
  font-weight:200;
  color:#3280e0;
}


  .box-product {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 80px 30px;
  }
  .box-product div {
    text-align: center;
  }
  .box-product img {
    width: 100%;
    margin:0;
    padding:0;
    margin-bottom:-20px;
  }
  .box-product h4 {
    font-size: 20px;
    font-weight:200;
    color:#3280e0;
    border: 1px solid #3280e0;
    padding:5px 20px;
    display: inline-block;
  }
  .box-farm {
    margin-top:40px;
  }
  @media only screen and (max-width: 991px) {
    .box-product {
      display: grid;
      grid-template-columns: repeat(1, 1fr);
      gap: 40px 0px;
    }
    .box-product h4 {
      font-size: 18px;
    }
  }






  #technical .header {
    width: 1100px;
    margin:0 auto;
    margin-top:70px;
    margin-bottom:100px;
  }
  #technical .js-text-slide-in,
  #technical .js-text-mask-wrap {
    line-height: 0;
  }
  #technical .js-text-mask {
    line-height: 1;
    overflow: hidden;
  }
  #technical .js-text-mask span span {
    display: inline-block;
    transform: translateY(100%);
    visibility: hidden;
  }
  #technical .header h2 {
    color:#3280e0;
    font-weight:100;
    font-size:80px!important;
    /* line-height: 1.35; */
    margin-left:-7px!important;
  }
  #technical .header h2 .js-text-mask{
    /* line-heightの代わり */
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  #technical .header h2 .sub {
    font-size:26px;
    font-weight: 300;
    display: block;
    padding-left:7px;
  }
  @media only screen and (max-width: 991px) {
    #technical .header {
      width: 100%;
      margin-top:80px;
      margin-bottom:70px;
      padding:0 15px;
    }
    #technical .header h2 {
      font-size:30px!important;
      margin-left:0px!important;
    }
    #technical .header h2 .sub {
      font-size:22px;
      display: block;
      padding-left:0px;
    }
  }






#technical .header {
    width: 1100px;
    margin:0 auto;
    margin-top:70px;
    margin-bottom:100px;
  }
  #technical .header h2 {
    color:#3280e0;
    font-weight:100;
    font-size:80px!important;
    /* line-height: 1.35; */
    margin-left:-7px!important;
  }
  #technical .header h2 .js-text-mask{
    /* line-heightの代わり */
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  #technical .header h2 .sub {
    font-size:26px;
    font-weight: 300;
    display: block;
    padding-left:7px;
  }
  @media only screen and (max-width: 991px) {
    #technical .header {
      width: 100%;
      margin-top:80px;
      margin-bottom:70px;
      padding:0 15px;
    }
    #technical .header h2 {
      font-size:30px!important;
      margin-left:0px!important;
    }
    #technical .header h2 .sub {
      font-size:22px;
      display: block;
      padding-left:0px;
    }
  }



#technical h3 {
  font-size: 46px;
  font-weight:200;
  color:#3280e0;
  margin-bottom: 40px;
  line-height:1.35;
}
#technical h4 {
  font-size: 30px;
  font-weight:200;
  color:#3280e0;
  border: 1px solid #3280e0;
  padding:5px 20px;
  display: inline-block;
  margin-top: 80px;
}
.box-va-ve img {
    width:100%;
  }
  .box-va-ve .img-va-ve {
    margin-top: 50px;
  }



@media only screen and (max-width: 991px) {
  #technical h3 {
    font-size: 30px;
    margin-top: 10px;
  }
  .box-va-ve .img-va-ve {
      margin-top: 20px;
    }
}



.box-original, .box-original2, .box-original3 {
    margin-top:30px;
  }
  .box-original img {
    margin-left:-15px;
    margin-top:20px;
  }
  .box-original2 img {
    width:100%;
  }
  .box-original3 img {
    margin-top:20px;
  }

  @media only screen and (max-width: 991px) {
    .box-original img {
      width: 100%;
    }
    .box-original3 img {
      width:100%;
    }
  }
.box-original, .box-original2, .box-original3 {
    margin-top:30px;
  }
  .box-original img {
    margin-left:-15px;
    margin-top:20px;
  }
  .box-original2 img {
    width:100%;
  }
  .box-original3 img {
    margin-top:20px;
  }

  @media only screen and (max-width: 991px) {
    .box-original img {
      width: 100%;
    }
    .box-original3 img {
      width:100%;
    }
  }



#technical .box-assurance {
    text-align:center;
    margin-top:50px;
  }
  @media only screen and (max-width: 991px) {
    #technical .box-assurance img {
      width:100%;
    }
  }



#technical table {
  width:100%;
  margin-top:30px;
  font-size:18px;
}

#technical table tr, thead {
  padding:10px;
}
#technical table tr td, thead th {
  padding:20px 20px;
}


#technical .table-responsive {margin-bottom:70px}
#technical .table-responsive .list-tit{background:#ebf4fb;color:#3d90da}
#technical .table-responsive .border-r-w{border-right:1px solid #fff}
#technical .table-responsive .border-r-b{border-right:1px solid #cdcdcd}
#technical .table-responsive .bg-g{background:#eff1f2}

@media only screen and (max-width: 991px) {
  #technical table {
    width:100%;
    margin-top:30px;
    font-size:16px;
  }
  #technical table tr td, thead th {
    padding:15px 15px;
  }
}






#csr .header {
    width: 1100px;
    margin:0 auto;
    margin-top:70px;
    margin-bottom:100px;
  }
  #csr .header h2 {
    color:#3280e0;
    font-weight:100;
    font-size:80px!important;
    /* line-height: 1.35; */
    margin-left:-7px!important;
  }
  #csr .header h2 .js-text-mask{
    /* line-heightの代わり */
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  #csr .header h2 .sub {
    font-size:26px;
    font-weight: 300;
    display: block;
    padding-left:7px;
  }
  @media only screen and (max-width: 991px) {
    #csr .header {
      width: 100%;
      margin-top:80px;
      margin-bottom:70px;
      padding:0 15px;
    }
    #csr .header h2 {
      font-size:30px!important;
      margin-left:0px!important;
    }
    #csr .header h2 .sub {
      font-size:22px;
      display: block;
      padding-left:0px;
    }
  }




#csr .container {
  width: 900px; /*1100px;*/
  margin:0 auto;
  display:block;
  padding-bottom:80px;
}
#csr .main {
  width: calc(100% - 260px);
}
#csr h3 {
  font-size: 36px;
  font-weight:200;
  color:#3280e0;
  margin-top:50px;
  /*margin-top: 40px;*/
}
#csr .container strong {
  display: block;
  margin-top: 30px;
  font-size:30px;
  font-weight:600;
}
#csr .container p {
  margin-top: 30px;
  line-height: 1.85;
}
#csr .container ol {
  margin-top:20px;
  line-height: 1.85;
}
#csr .container ol li {
  margin-bottom: 10px;
  list-style-type: none;
  counter-increment: cnt;
}
#csr .container ol li::before {
  content: "(" counter(cnt) ") ";
}
@media only screen and (max-width: 991px) {
  #csr .container {
    width: 100%;
    margin:0 auto;
    display: block;
    padding:0 15px;
  }
  #csr .main {
    width:100%;
  }
  #csr h3 {
    font-size: 30px;
  }
  #csr .container p {
    margin-top: 20px;
  }
}













#privacy-policy .header {
    width: 1100px;
    margin:0 auto;
    margin-top:70px;
    margin-bottom:100px;
  }
  #privacy-policy .header h2 {
    color:#3280e0;
    font-weight:100;
    font-size:80px!important;
    /* line-height: 1.35; */
    margin-left:-7px!important;
  }
  #privacy-policy .header h2 .js-text-mask{
    /* line-heightの代わり */
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  #privacy-policy .header h2 .sub {
    font-size:26px;
    font-weight: 300;
    display: block;
    padding-left:7px;
  }
  @media only screen and (max-width: 991px) {
    #privacy-policy .header {
      width: 100%;
      margin-top:80px;
      margin-bottom:70px;
      padding:0 15px;
    }
    #privacy-policy .header h2 {
      font-size:30px!important;
      margin-left:0px!important;
    }
    #privacy-policy .header h2 .sub {
      font-size:22px;
      display: block;
      padding-left:0px;
    }
  }




#privacy-policy .container {
  width: 900px; /*1100px;*/
  margin:0 auto;
  display:block;
  padding-bottom:80px;
}

#privacy-policy h3 {
  font-size: 36px;
  font-weight:200;
  color:#3280e0;
  margin-top:50px;
  /*margin-top: 40px;*/
}
#privacy-policy .container p {
  margin-top: 30px;
  line-height: 1.85;
}
#privacy-policy .container ul {
margin-top:20px;
}
#privacy-policy .container ul li {
list-style:disc;
margin-left:20px;
margin-bottom:20px;
}
#privacy-policy .container ol {
  margin-top:20px;
  line-height: 1.85;
}
#privacy-policy .container ol li {
  margin-bottom: 10px;
  list-style-type: none;
  counter-increment: cnt;
}
#privacy-policy .container ol li::before {
  content: "(" counter(cnt) ") ";
}
@media only screen and (max-width: 991px) {
  #privacy-policy .container {
    width: 100%;
    margin:0 auto;
    display: block;
    padding:0 15px;
  }
  #privacy-policy h3 {
    font-size: 30px;
  }
  #privacy-policy .container p {
    margin-top: 20px;
  }
}





#contact .container {
  width: 900px; /*1100px;*/
  margin:0 auto;
  display:block;
  padding-bottom:80px;
}
#contact h3 {
  font-size: 36px;
  font-weight:200;
  color:#3280e0;
  margin-top:50px;
  margin-bottom: 40px;
  /*margin-top: 40px;*/
}
#contact .container p {
  margin-bottom: 0;
  padding:0;
  line-height: 1.85;
}
#contact .container p span {
  padding-left:20px;
  color: red;
}
#contact .container .box-contact {
  margin-top:50px;
}
#contact .container input,
#contact .container select,
#contact .container textarea {
  width:100%;
  margin: 0;
  padding:15px 0px 15px 25px;
  appearance: none;
  border: 1px solid #000;
}
#contact .btn-send {
  margin-top:50px;
  margin-bottom: 140px;
  text-align:center;
}
#contact .btn-form {
  background-color:#3280e0;
  color: #fff;
}
@media only screen and (max-width: 991px) {
  #contact .container {
    width: 100%;
    margin:0 auto;
    display: block;
    padding:0 15px;
  }
  #contact h3 {
    font-size: 30px;
  }
  #contact .btn-send {
    margin-top:20px;
    margin-bottom: 100px;
  }
}
#contact .header {
    width: 1100px;
    margin:0 auto;
    margin-top:70px;
    margin-bottom:100px;
  }
  #contact .header h2 {
    color:#3280e0;
    font-weight:100;
    font-size:80px!important;
    /* line-height: 1.35; */
    margin-left:-7px!important;
  }
  #contact .header h2 .js-text-mask{
    /* line-heightの代わり */
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  #contact .header h2 .sub {
    font-size:26px;
    font-weight: 300;
    display: block;
    padding-left:7px;
  }
  @media only screen and (max-width: 991px) {
    #contact .header {
      width: 100%;
      margin-top:80px;
      margin-bottom:70px;
      padding:0 15px;
    }
    #contact .header h2 {
      font-size:30px!important;
      margin-left:0px!important;
    }
    #contact .header h2 .sub {
      font-size:22px;
      display: block;
      padding-left:0px;
    }
  }

.contact-tel {
    display:flex;
    margin-bottom:80px;
  }
  .contact-tel div {
    flex:1;
  }
  .contact-tel div span {
    font-size:40px;
  }
  @media only screen and (max-width: 991px) {
    .contact-tel {
      display:block;
      margin-bottom:80px;
    }
    .contact-tel div {
      width:100%;
      margin-top:20px;
    }
    .contact-tel div span {
      font-size:38px;
      display:block;
    }
  }


div.wpcf7{margin:0;padding:0}
div.wpcf7 .screen-reader-response{position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);height:1px;width:1px;margin:0;padding:0;border:0}
div.wpcf7-response-output{margin:2em .5em 1em;padding:.2em 1em;/*background:#cb2e1b;*/color:#cb2e1b}
div.wpcf7-mail-sent-ok{background:#01548d;color:#fff}
div.wpcf7-aborted,div.wpcf7-acceptance-missing,div.wpcf7-mail-sent-ng,div.wpcf7-spam-blocked,div.wpcf7-validation-errors{background:#cb2e1b;color:#fff}
.wpcf7-form-control-wrap{position:relative}
span.wpcf7-not-valid-tip{color:#cb2e1b;font-size:1em;font-weight:400;display:block}
.use-floating-validation-tip span.wpcf7-not-valid-tip{position:absolute;top:20%;left:20%;z-index:100;border:1px solid #cb2e1b;background:#fff;padding:.2em .8em}
span.wpcf7-list-item{display:inline-block;margin:0 0 0 1em}
span.wpcf7-list-item-label::after,span.wpcf7-list-item-label::before{content:" "}
.wpcf7-display-none{display:none}
div.wpcf7 .ajax-loader{visibility:hidden;display:inline-block;background-image:url(/assets/img/ajax-loader.gif);width:16px;height:16px;border:none;padding:0;margin:0 0 0 4px;vertical-align:middle}
div.wpcf7 .ajax-loader.is-active{visibility:visible}
div.wpcf7 div.ajax-error{display:none}
div.wpcf7 .placeheld{color:#888}
div.wpcf7 .wpcf7-recaptcha iframe{margin-bottom:0}
div.wpcf7 input[type=file]{cursor:pointer}
div.wpcf7 input[type=file]:disabled{cursor:default}

 






#recruit .header {
    width: 1100px;
    margin:0 auto;
    margin-top:70px;
    margin-bottom:100px;
  }
  #recruit .header h2 {
    color:#3280e0;
    font-weight:100;
    font-size:80px!important;
    /* line-height: 1.35; */
    margin-left:-7px!important;
  }
  #recruit .header h2 .js-text-mask{
    /* line-heightの代わり */
    display: inline-block;
    margin-top: .175em;
    margin-bottom: .175em;
  }
  #recruit .header h2 .sub {
    font-size:26px;
    font-weight: 300;
    display: block;
    padding-left:7px;
  }
  @media only screen and (max-width: 991px) {
    #recruit .header {
      width: 100%;
      margin-top:80px;
      margin-bottom:70px;
      padding:0 15px;
    }
    #recruit .header h2 {
      font-size:30px!important;
      margin-left:0px!important;
    }
    #recruit .header h2 .sub {
      font-size:22px;
      display: block;
      padding-left:0px;
    }
  }



#recruit .container {
  width: 900px; /*1100px;*/
  margin:0 auto;
  display:block;
  padding-bottom:80px;
}
#recruit h3 {
  font-size: 36px;
  font-weight:200;
  color:#3280e0;
  margin-top:50px;
  margin-bottom: 40px;
  /*margin-top: 40px;*/
}
#recruit .container p {
  margin-bottom: 0;
  padding:0;
  line-height: 1.85;
}
#recruit .container p span {
  padding-left:20px;
  color: red;
}
#recruit .container .box-contact {
  margin-top:50px;
}
#recruit .container input,
#recruit .container select,
#recruit .container textarea {
  width:100%;
  margin: 0;
  padding:15px 0px 15px 25px;
  appearance: none;
  border: 1px solid #000;
}
@media only screen and (max-width: 991px) {
  #recruit .container {
    width: 100%;
    margin:0 auto;
    display: block;
    padding:0 15px;
  }
  #recruit h3 {
    font-size: 30px;
  }
}