/*アコーディオン全体*/
.accordion_area{
    list-style: none;
    margin:0 auto;
    padding: 0;
}
.btn {
    border-radius: unset;
    width: 100%;
    padding: 20px 0;
    background-color: #fff;
    font-size: 17px;
    font-weight: bold;
    color: #0032a1;
}
.btn:hover {
    color: #0032a1;
}
.btn-check:focus+.btn, .btn:focus {
    box-shadow: unset;
}
.contents {
    text-align: left;
}
.contents_btn {
    width: 100%;
    padding: 20px 0 20px 14%;
    background-color: #fff;
    font-size: 24px;
    font-weight: bold;
    color: #0032a1;
    display: inline-block;
    text-decoration: none;
}
.btn_hover:hover {
    background-color: #098fe7;
    color: #fff;
}
.open {
    position: relative;
}
.open::after {
    content: "\f103";
    font-family: Font Awesome\ 5 Free;
    margin: auto;
    position: absolute;
    top: 14.5px;
    right: 42px;
    font-size: 24px;
}
.open::before {
    content: "\f103";
    font-family: Font Awesome\ 5 Free;
    margin: auto;
    position: absolute;
    top: 14.5px;
    left: 42px;
    font-size: 24px;
}
.close {
    background-color: #2a3c54;
    position: relative;
    color: #fff!important;
}
.close::after {
    content: "\f102";
    font-family: Font Awesome\ 5 Free;
    margin: auto;
    position: absolute;
    top: 21.5px;
    right: 42px;
    font-size: 24px;
}
.close::before {
    content: "\f102";
    font-family: Font Awesome\ 5 Free;
    margin: auto;
    position: absolute;
    top: 21.5px;
    left: 42px;
    font-size: 24px;
}
.step_list {
    margin: 0;
    padding: 0;
}
.step_text {
    width: 100%;
    padding: 10px 0 15px 14%;
    background-color: #fff;
    font-size: 22px;
    font-weight: bold;
    color: #000;
    display: inline-block;
    text-decoration: none;
}
.step_text img {
    width: 25%;
    margin-right: 15px;
    padding-bottom: 5px;
}

/*アコーディオンタイトル*/
.title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size:15px;
    font-weight: normal;
    transition: all 0.1s ease;
    text-align: center;
    color: #000;
    display: block;
    font-size: 1.17em;
    margin: 0;

}

/*アイコンの＋と×*/
.title::before,
.title::after{
    position: absolute;
    content:'';
    width: 15px;
    height: 2px;
    background-color: #fff;
}
.title::before{
    top:48%;
    right: 15px;
    transform: rotate(0deg);
}
.title::after{
    top:48%;
    right: 15px;
    transform: rotate(90deg);
}

/*　closeというクラスがついたら形状変化　*/

.title.close::before{
	transform: rotate(45deg);
}

.title.close::after{
	transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.box {
    display: none;/*はじめは非表示*/
    background: #f3f3f3;
    padding: 3%;
    text-align: left;
    font-size: 14px;
}

.application_content {
    background-color: #f00;
    padding: 5% 0;
}



/* common css */
body {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    background: radial-gradient(#004091, #a0d9f6);
    font-family: "Helvetica Neue", Helvetica, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Arial, sans-serif;
    -webkit-appearance: none;
}

main {
    background-color: #fff;
}

a {
    text-decoration: none;
}

.mb-10 {
    margin-bottom: 10px;
}

.mt-10 {
    margin-top: 10px;
}

.mt-20 {
    margin-top: 20px;
}

.mb-20 {
    margin-bottom: 20px;
}

.pt-30 {
    padding-top: 30px;
}

.pb-30 {
    padding-bottom: 30px;
}

.pc {
    display: none;
}

.sp {
    display: block;
}

.small_text {
    font-size: 14px;
}

.enjoy {
    position: absolute;
    top: 28px;
    left: 76px;
    transform: rotate(353deg);
    color: #fff;
    opacity: 0.8;
}

header h1.logo {
    padding: 5px 0;
    margin: 0;
    background-color: #fff;
}

header h1.logo img {
    width: 60px;
    margin: 0 auto;
}

.contents_box {
    position: relative;
    border: solid 1px #f0f0f0;
    background-color: #fff;
}

.contents_box p {
    padding-left: 14%;
    padding-top: 20px;
    font-size: 16px;
    font-weight: bold;
}

.bayticke::before {
    content: '';
    position: absolute;
    top: 20px;
    right: 12%;
    display: inline-block;
    width: 75px;
    height: 75px;
    background-image: url(../img/bayticke.jpg?v=1);
    background-size: cover;
}

main img {
    width: 100%;
}

.content {
    padding: 0 20px;
}

.h1 {
    background-image: url(../img/tanoshimi_back.png?v=1);
    background-size: contain;
    margin: 0;
    padding: 15px 0;
}

.h1 img {
    width: 75%;
}

.h2 {
    padding: 16px 10px;
    background-color: #098fe7;
    font-size: 26px;
    color: #fff;
    text-align: center;
    margin-bottom: 5px;
    font-weight: bold;
}

.h3 {
    font-size: 18px;
    font-weight: bold;
    margin: 20px 0 10px;
    color: #000;
    word-break: break-all;
    /* border: 4px solid #004091; */
    padding: 10px;
    text-align: center;
    border-bottom: 2px solid #000;
    width: 230px;
    margin-left: auto;
    margin-right: auto;
}
.h4 {
    font-size: 16px;
    font-weight: bold;
    margin: 20px 0 10px;
    color: #000;
    word-break: break-all;
    padding: 15px 25px;
}

p {
    font-size: 14px;
    margin: 0;
}

video {
    width: 100%;
}

.text_color-accent {
    color: #cc3333;
}

.attention {
    font-size: 13px;
    display: flex;
}

.sns-content {
    background-color: #098fe7;
    align-items: center;
    color: #fff;
    padding: 20px 25px;
    justify-content: space-between;
}

.icon_box {
    display: flex;
    width: 90%;
    margin: 0 auto;
}

.sns-content img {
    width: 80%;
    border-radius: 12px;
}

.sns-content a {
    text-align: center;
}

.footer-logo {
    background-color: #fff;
    text-align: center;
}

.footer-logo img {
    width: 100%;
    padding: 18px 85px;
}

.movie {
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.movie video {
    width: 100%;
}

.movie .play-btn {
    display: block;
    width: 20%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
}

.movie .play-btn.playActive {
    display: none;
}

@media screen and (min-width:768px) {
    .pc {
        display: block;
    }

    .sp {
        display: none;
    }
}

.coming-text {
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
    margin-top: 20px;
}

/* .special .desc {
    font-size: 24px;
    line-height: 1.6;
}

.special .special_wrap {
    display: flex;
    gap: 20px;
    padding-bottom: 30px;
    margin: 0 35px;
} */
.special .desc {
    font-size: 16px;
    /* text-align: center; */
}

.special .special_wrap {
    display: flex;
    gap: 20px;
    flex-direction: column;
    padding: 30px 0 10px 0;
    margin: 0 20px;
}

.special .special_wrap img {
    max-width: 100%;
}

.special .special_wrap img {
    width: 100%;
    max-width: 540px;
    object-fit: contain;
}

/* @media only screen and (max-width: 1119px) {
    .special .special_wrap img {
        max-width: 470px;
    }
}

@media only screen and (max-width: 991px) {
    .special .desc {
        font-size: 18px;
    }

    .special .special_wrap img {
        max-width: 355px;
    }

} */

.special .content_wrap {
    background-image: url(../img/yis25_kv2.jpg);
    background-size: 130%;
    background-position: top;
    background-repeat: repeat-y;
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
    /* background-blend-mode: lighten;
    background-color: rgba(255, 255, 255, 0.7); */
}

.special .content_wrap::before {
    content: "";
    position: absolute;
    inset: 0; /* shorthand for top:0; right:0; bottom:0; left:0; */
    background-color: rgba(255, 255, 255, 0.7); /* semi-transparent white layer */
    z-index: -1;
    pointer-events: none; /* let clicks go through */
  }

.special .content_wrap .content {
    padding: 0 20px;
}

.special .content_wrap .content:first-child {
    padding-top: 20px;
}
.special .content_wrap .content:last-child {
    padding-bottom: 10px;
}

.special .content_wrap .content_box {
    border: 2px solid #006DC1;
    padding: 30px 8px;
    background-color: rgba(255, 255, 255, 0.9);

}

.special .content_wrap .content_box .content_ttl {
    font-family: 'Modula OT Sans Bold';
    font-weight: 700;
}

.special .content_wrap .content_box .content_desc {
    font-family: 'Broadway';
}

@media only screen and (max-width: 767px) {
    .special .desc {
        font-size: 16px;
        /* text-align: center; */
    }

    .special .special_wrap {
        display: flex;
        flex-direction: column;
        padding: 30px 0 10px 0;
        margin: 0 6px;
    }

    .special .special_wrap img {
        max-width: 100%;
    }
}

@media only screen and (max-width: 575px) {
    .special .desc {
        font-size: 14px;
    }
}



.penlight .desc {
    font-size: 16px;
    line-height: 1.6;
}

.penlight .penlight_wrap {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 30px 0;
    margin: 0 35px;
}

@media only screen and (max-width: 575px) {
    .penlight .desc {
        font-size: 14px;
    }
}

.button {
    display: inline-block;
    min-width: 200px;
    padding: 14px 40px;
    background-color: #004091;
    color: #FFF;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5em;
    text-align: center;
    text-decoration: none;
    border: 0;
    cursor: pointer;
}
.button:hover {
    color: #fff;
    opacity: 0.7;
    transition: 0.3s ease all;
}

.text--center {
    text-align: center;
}

.comingsoon {
    font-size: 25px;
    padding: 20px;
    font-weight: 700;
    text-align: center;
    color: #0287CE;
}

h3.heading {
    margin-top: 30px;
    padding: 15px 25px;
    font-size: 18px;
    font-weight: 700;
    background-color: #FFF;
    border-bottom: 1px solid #e0e0e0;
    border-left: 4px solid #004091;
    color: #262626;
    margin-bottom: 30px;
}
table tr th {
    padding: 10px;
    background-color: #F0F0F0;
    border: 1px solid #e0e0e0;
    color: #262626;
    font-size: 14px;
    font-weight: bold;
}
.table-simple {
    width: 100%;
    max-width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}
.table-simple th {
    background-color: #f0f0f0;
    vertical-align: middle;
}
.table-simple td, .table-simple th {
    padding: 10px;
    border: 1px solid #e0e0e0;
}
table tr td {
    padding: 10px;
    border: 1px solid #e0e0e0;
    color: #4d4d4d;
    font-size: 14px;
    background-color: #fff;
}
.text__color--accent {
    color: #f75239;
}
ul.newsattention {
    list-style-type: none;
    margin-left: -18px;
    font-size: 14px;
}
ul.newsattention li:before {
    content: '※';
    margin-left: -12px;
    color: #cc3333;
}

.info_item {
    font-size: 14px;
    color: #003a8f;
    font-size: 14px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.date {
    color: #808793;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.56px;
    display: block;
}

.line {
    display: block;
    background-color: #f5f5f5;
    height: 2px;
    width: 100%;    
}

.info_box .info_item {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .h5{
    background: #006DC1;
    font-size: 18px;
    font-weight: bold;
    margin: 20px 0 10px;
    color: white;
    padding: 10px;
    text-align: center;
    width: max-content;
  }
  

  /* fadeUp */

.fadeUp{
    animation-name:fadeUpAnime;
    animation-duration:1s;
    animation-fill-mode:forwards;
    opacity:0;
    }
    
    @keyframes fadeUpAnime{
      0% {
        opacity: 0;
      transform: translateY(50px);
      }
    
      100% {
        opacity: 1;
      transform: translateY(0);
      }
    }
    
    
    /* スクロールをしたら出現する要素にはじめに透過0を指定　*/
     
    .fadeUpTrigger{
        opacity: 0;
    }


.fade {
  animation-name: fade;
  animation-duration: 1s;
}
    @keyframes fade{
      0%{
        opacity: 0;
      }
      100%{
        opacity: 1;
      }
}

/*!
 * Bootstrap Reboot v5.2.1 (https://getbootstrap.com/)
 * Copyright 2011-2022 The Bootstrap Authors
 * Copyright 2011-2022 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
 :root{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-black:#000;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-body-color-rgb:33,37,41;--bs-body-bg-rgb:255,255,255;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-bg:#fff;--bs-border-width:1px;--bs-border-style:solid;--bs-border-color:#dee2e6;--bs-border-color-translucent:rgba(0,0,0,.175);--bs-border-radius:.375rem;--bs-border-radius-sm:.25rem;--bs-border-radius-lg:.5rem;--bs-border-radius-xl:1rem;--bs-border-radius-2xl:2rem;--bs-border-radius-pill:50rem;--bs-link-color:#0d6efd;--bs-link-hover-color:#0a58ca;--bs-code-color:#d63384;--bs-highlight-bg:#fff3cd}*,*::before,*::after{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0)}hr{margin:1rem 0;color:inherit;border:0;border-top:1px solid;opacity:.25}h6,h5,h4,h3,h2,h1{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2}h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){h1{font-size:2.5rem}}h2{font-size:calc(1.325rem + 0.9vw)}@media (min-width:1200px){h2{font-size:2rem}}h3{font-size:calc(1.3rem + 0.6vw)}@media (min-width:1200px){h3{font-size:1.75rem}}h4{font-size:calc(1.275rem + 0.3vw)}@media (min-width:1200px){h4{font-size:1.5rem}}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-left:2rem}ol,ul,dl{margin-top:0;margin-bottom:1rem}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:.875em}mark{padding:.1875em;background-color:var(--bs-highlight-bg)}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:var(--bs-link-color);text-decoration:underline}a:hover{color:var(--bs-link-hover-color)}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}pre,code,kbd,samp{font-family:var(--bs-font-monospace);font-size:1em}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:.875em;color:var(--bs-code-color);word-wrap:break-word}a>code{color:inherit}kbd{padding:.1875rem .375rem;font-size:.875em;color:var(--bs-body-bg);background-color:var(--bs-body-color);border-radius:.25rem}kbd kbd{padding:0;font-size:1em}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:.5rem;padding-bottom:.5rem;color:#6c757d;text-align:left}th{text-align:inherit;text-align:-webkit-match-parent}thead,tbody,tfoot,tr,td,th{border-color:inherit;border-style:solid;border-width:0}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator{display:none!important}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:left;width:100%;padding:0;margin-bottom:.5rem;font-size:calc(1.275rem + 0.3vw);line-height:inherit}@media (min-width:1200px){legend{font-size:1.5rem}}legend+*{clear:left}::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-text,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:textfield}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}::file-selector-button{font:inherit;-webkit-appearance:button}output{display:inline-block}iframe{border:0}summary{display:list-item;cursor:pointer}progress{vertical-align:baseline}[hidden]{display:none!important}