@charset "UTF-8";
/* CSS Document */
@font-face {
    font-family: ‘utsukushiregular’;
    src: url(../fonts/UtsukushiMincho-FONT/UtsukushiFONT.otf);
}
*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

/* 
html {
    font-size: 62.5%;
} */
body {
    -webkit-text-size-adjust: 100%;
    word-wrap: break-word;
    overflow-wrap: break-word;
    line-height: 1.6;
    color: inherit;
    letter-spacing: 0.093em;
    font-variant-ligatures: none;
    font-family: '游明朝体', 'Yu Mincho', YuMincho, 'ヒラギノ明朝 Pro',
        'Hiragino Mincho Pro', 'MS P明朝', 'MS PMincho', serif;
}

img {
    width: 100%;
    vertical-align: bottom;
    height: auto;
}

a:hover {
    opacity: 0.8;
    transition: 0.5s;
    transition: 0.5s;
}

a {
    text-decoration: none;
    transition: 0.5s;
    transition: 0.5s;
    color: #505050;
}

.d_fl {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

#button {
    display: inline-block;
    width: 50px;
    height: 50px;
    text-align: center;
    border-radius: 4px;
    position: fixed;
    bottom: 30px;
    right: 30px;
    transition: background-color 0.3s, opacity 0.5s, visibility 0.5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
}

#button:hover {
    cursor: pointer;
}

#button.show {
    opacity: 1;
    visibility: visible;
}

/* メインイメージ */
.top_mv {
    width: 100%;
    height: 100vh;
    background-size: cover;
    background-position: top center;
    background-attachment: local;
    position: relative;
}

.top_mv_inner {
    width: 100%;
    height: 100vh;
    margin: auto;
    position: relative;
}

.mv_content {
    width: 100%;
    margin: auto;
    position: absolute;
    bottom: 0;
    left: 10%;
    transform: translate(-10%, 0);
}

.mv_content h1 {
    width: 90%;
    margin: auto;
    font-size: 5.1875rem;
    color: #ffffff;
    padding: 60px 0;
    text-align: left;
    letter-spacing: 8px;
    font-weight: 600;
    font-family: ‘utsukushiregular’, ‘游明朝’, YuMincho, ‘ヒラギノ明朝 ProN W3’,
        ‘HiraMinProN-W3’, ”メイリオ”, Meiryo, serif;
}

.mv_content_inner {
    max-width: 500px;
    margin: auto;
    margin-right: 0;
    color: #fff;
}

/* メインコンテンツ */
/* info */
.maininfo {
    width: 100%;
    overflow: hidden;
}

.info_inner {
    max-width: 1000px;
    width: 90%;
    margin: auto;
    padding: 50px 0 70px;
    text-align: center;
}

.info_inner .info_ttl {
    max-width: 500px;
    width: 90%;
    margin: 0 auto 50px;
}

.info_inner .info_ttl_art {
    max-width: 600px;
    width: 90%;
    margin: 0 auto 50px;
}

.info_inner .info_ttl h2,
.info_inner .info_ttl_art h2 {
    padding: 10px 0;
    font-size: 1.8125rem;
    font-weight: 600;
    font-family: '游ゴシック', 'Yu Gothic', '游ゴシック体', YuGothic, sans-serif;
    letter-spacing: 0px;
}

.info_inner .into_moto {
    width: 90%;
    margin: 40px auto;
    text-align: center;
    color: #fff;
    font-size: 1.875rem;
    padding: 10px 0;
    text-align: center;
}

.info_inner .into_moto h2 {
    width: 90%;
    margin: auto;
}

.info_inner p {
    margin: auto;
    text-align: center;
    font-size: 1.25rem;
    font-family: '游ゴシック', 'Yu Gothic', '游ゴシック体', YuGothic, sans-serif;
    font-weight: 600;
    color: #333;
}

/* reason */
.mainreasons {
    max-width: 1000px;
    width: 100%;
    margin: 100px auto;
}

#about {
    max-width: 1000px;
    width: 100%;
    margin: 100px auto;
}

/* 特徴 */
.fbox {
    width: 100%;
    margin: 150px auto 0;
}

.check_thepoints {
    width: 100%;
    margin: 30px auto 0;
}

.check_thepoints_inner img {
    max-width: 78px;
    width: 100%;
    padding-right: 20px;
}

.check_thepoints_inner h2 {
    width: 100%;
    font-size: 1.875rem;
    font-family: '游ゴシック', 'Yu Gothic', '游ゴシック体', YuGothic, sans-serif;
    font-weight: 600;
    padding: 5px 10px;
    margin: 20px 0;
    align-items: center;
    flex-wrap: nowrap;
    box-sizing: border-box;
}

.check_exp {
    font-size: 1.125rem;
    margin: 15px 0 25px;
}

.about_content_03_steps li {
    border: 1px solid #8a8c8c;
}

/* SNS LINK */
.sns {
    margin: 0 0 50px;
}

.sns ul {
    display: flex;
    justify-content: center;
}

.sns ul li {
    display: block;
    flex-basis: 80px;
    margin: 20px;
}

/* ボタン */
.about_link_btn02 .about_link_btn_inner a .more {
    font-size: 1.25rem;
}

/* footer */
footer {
    background: #f5f5f5;
}

.ft_inner {
    max-width: 1000px;
    width: 90%;
    margin: auto;
    padding: 40px 0 0;
}

.ft_logo {
    max-width: 382px;
}

.ft_content p {
    padding-bottom: 20px;
}

.ft_content {
    margin-left: 95px;
    color: #484748;
    font-size: 0.875rem;
    line-height: 2;
    font-weight: 600;
    padding: 10px 0;
}

.ft_content p span {
    font-size: 0.9375rem;
}

.ft_copy {
    width: 100%;
    margin: auto;
    padding: 25px 0;
    background: #8ec54a;
    color: #fff;
    text-align: center;
    font-size: 0.8125rem;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .yb {
        display: block;
        width: 100%;
        background-color: #f3eb34;
        z-index: -1;
        padding: 0 5px 0;
        box-sizing: border-box;
        position: absolute;
        bottom: 30px;
    }
}
@media screen and (-ms-high-contrast: none) and (max-width: 768px),
    screen and (-ms-high-contrast: active) and (max-width: 768px) {
    .yb {
        display: block;
        width: 100%;
        background-color: #f3eb34;
        z-index: -1;
        padding: 0 5px 0;
        box-sizing: border-box;
        position: absolute;
        bottom: 20px;
    }
}
/*responsive breakpoint */
@media screen and (min-width: 769px) {
    .pc_only {
        display: block;
    }
    .sp_only {
        display: none;
    }
}
@media screen and (max-width: 768px) {
    .pc_only {
        display: none;
    }
    .sp_only {
        display: block;
    }
}
@media screen and (max-width: 768px) {
    .yb {
        display: block;
        width: 100%;
        height: 12px;
        background-color: #f3eb34;
        z-index: -1;
        padding: 0 5px 0;
        box-sizing: border-box;
        position: absolute;
        bottom: 0;
    }
    /* SPナビゲーション */
    .sticky_menu {
        position: fixed;
        top: 0;
        left: 0;
        background: #fff;
        width: 100%;
        z-index: 9999;
    }
    .sticky_menu #title {
        text-align: left;
        padding: 5px 0 5px 10px;
    }
    .sticky_menu #title img {
        width: 55%;
        height: auto;
    }
    #MenuBox {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 9990;
    }
    #MainMenu {
        display: none;
        width: 100%;
        background: #fff;
        z-index: 9900;
        padding: 60px 0px 0px 0px;
    }
    .cheer #MainMenu {
        background-color: #30b9c4;
    }
    #Toggle {
        position: absolute;
        top: 10px;
        right: 5px;
        display: block;
        cursor: pointer;
        z-index: 9999;
    }
    #GNavi01,
    #GNavi02,
    #GNavi03,
    #GNavi04,
    #GNavi05 {
        font-size: 1rem;
        padding: 10px 0px 8px 0px;
        border-top: solid 1px #ccc;
        cursor: pointer;
        position: relative;
    }
    #GNavi06,
    #GNavi07,
    #GNavi08,
    #GNavi09,
    #GNavi10,
    #GNavi11 {
        font-size: 1rem;
        border-top: solid 1px #ccc;
    }
    #GNavi07 {
        background-color: #b5e4ea;
    }
    #GNavi08 {
        background-color: #efefef;
    }
    #GNavi09 {
        background-color: #ff0;
    }
    #GNavi10 {
        background-color: #30bac5;
        border-bottom: solid 1px #ccc;
    }
    #GNavi06 a,
    #GNavi07 a,
    #GNavi08 a,
    #GNavi09 a,
    #GNavi10 a,
    #GNavi11 a {
        display: block;
        padding: 10px 0px 8px 20px;
    }
    #GNavi10 a {
        color: #fff;
    }
    #GNavi01 span,
    #GNavi02 span,
    #GNavi03 span,
    #GNavi04 span,
    #GNavi05 span {
        padding: 0px 0px 0px 20px;
        position: relative;
    }
    #GNavi01 span:after,
    #GNavi02 span:after,
    #GNavi03 span:after,
    #GNavi04 span:after,
    #GNavi05 span:after {
        content: '';
        width: 0;
        height: 0;
        position: absolute;
        top: 1px;
        right: -20px;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        border-top: 14px solid #000000;
    }
    #ChildNav01,
    #ChildNav02,
    #ChildNav03,
    #ChildNav04,
    #ChildNav05 {
        display: none;
        margin: 9px 0px -8px 0px;
    }
    #ChildNav01 li,
    #ChildNav02 li,
    #ChildNav03 li,
    #ChildNav04 li,
    #ChildNav05 li {
        font-size: 1rem;
        background-color: #efefef;
        border-top: solid 1px #fff;
    }
    #ChildNav01 li a,
    #ChildNav02 li a,
    #ChildNav03 li a,
    #ChildNav04 li a,
    #ChildNav05 li a {
        display: block;
        padding: 10px 20px 8px 30px;
    }
    .cheer header nav ul {
        background-color: #30b9c4;
    }
    .cheer header nav ul li {
        font-size: 1rem;
        color: #fff;
        border-top: solid 1px #fff;
    }
    .cheer header nav ul li a {
        display: block;
        padding: 10px 20px 8px 30px;
        color: #fff;
        text-decoration: none;
    }
    .cheer header nav ul li#CNavi01 a {
        background-color: #ff0;
        color: #666;
    }
    .cheer header nav ul li#CNavi02 a {
        background-color: #666;
    }
    .cheer header nav ul li#CNavi03 a {
        background-color: #06c;
    }
    .cheer header nav ul li#CNavi04 a {
        background-color: #b5e4ea;
        color: #666;
    }
    .open ul {
        display: block !important;
        transition: all 0.3s;
    }
    #SRBtn {
        position: fixed;
        top: 10px;
        right: 50px;
        width: 40px;
        height: 50px;
        z-index: 9999;
    }
    #OCBtn {
        position: fixed;
        top: 10px;
        right: 95px;
        width: 40px;
        height: 50px;
        z-index: 9999;
    }
    /* ボタン */
    .about_link_btn02 .about_link_btn_inner a .more {
        font-size: 0.875rem;
    }
    /* フッター */
    .ft_logo {
        max-width: 330px;
        width: 100%;
        margin: 20px auto;
        padding: 0;
    }
    .ft_content {
        width: 100%;
        text-align: center;
        margin: 0;
    }
    .ft_content address {
        font-size: 0.875rem;
    }
    .ft_copy {
        width: 100%;
        margin: auto;
        padding: 25px 10px;
        color: #fff;
        text-align: center;
        font-size: 10px;
        box-sizing: border-box;
    }
    #mainMoto {
        padding: 90px 0px 0px 0px;
    }
}
@media screen and (min-width: 481px) {
    .pc-pc_only {
        display: block;
    }
    .sp-sp_only {
        display: none;
    }
}
@media screen and (max-width: 480px) {
    .pc-pc_only {
        display: none;
    }
    .sp-sp_only {
        display: block;
    }
    #mainMoto {
        padding: 70px 0px 0px 0px;
    }
    .top_mv {
        height: 70vh;
    }
    .top_mv_inner {
        height: 70vh;
    }
}
@-moz-document url-prefix() {
}
/* YouTubeレスポンシブ化 */
@media screen and (max-width: 768px) {
    .youtube {
        position: relative;
        width: 100%;
        padding-top: 56.25%;
        text-align: center;
    }
    .youtube iframe {
        position: absolute;
        top: 0;
        right: 0;
        width: 100%;
        height: 100%;
    }
}
/* 下層ページ　パンフレットはこちらの文字 */
.linkfont {
    font-size: 0.875rem;
    color: #000000;
    line-height: 1.6;
    letter-spacing: 0.15em;
    font-variant-ligatures: none;
    font-family: '游明朝体', 'Yu Mincho', YuMincho, 'ヒラギノ明朝 Pro',
        'Hiragino Mincho Pro', 'MS P明朝', 'MS PMincho', serif;
    padding-top: 10px;
}

/* 下層ページ　臨時のお知らせ　赤文字・赤枠 */
.attention {
    margin: 100px auto;
}

.attention_ttl {
    display: block;
    border: #ff0000 2px solid;
    text-align: center;
    color: #ff0000;
    font-size: 1.25rem;
    padding: 20px;
    max-width: 800px;
    width: 90%;
    margin: 0 auto 60px;
    box-sizing: border-box;
}

.c-header-ttl,
#gnav03 {
    z-index: 2;
}

#gnav {
    z-index: 1;
}

header,
footer {
    letter-spacing: 0;
}

#main_content .linkfont a:active,
#main_content .linkfont a:hover,
#main_content .linkfont a:link,
#main_content .linkfont a:visited {
    color: #505050;
}

@media screen and (min-width: 1200px) {
    .c-gnav01-item01 a {
        line-height: 2em;
    }
}
