@charset "utf-8";
/* CSS Document */

/*
Theme Name: vallanail
Theme URI: https://vallanail-school.jp/
Author: vallanail-school
Author URI: https://vallanail-school.jp/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags:
*/

/* A Modern CSS Reset */
*,*::before,*::after{box-sizing:border-box}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role="list"],ol[role="list"]{list-style:none}a:not([class]){text-decoration-skip-ink:auto}picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}table{border-collapse: collapse;border-spacing: 0;width: 100%;}


html {
    font-size: 1rem;
    scroll-behavior: smooth;
    scroll-padding-top:80px;
}

body {
    position: relative;
    font-family: Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
    font-optical-sizing: auto;
    line-height: 1.8;
    color: #000;
    font-size: 14px;
}
@media only screen and (min-width: 768px) , print {
    body {
        font-size: 16px;
    }
}

::selection {
    background-color: #c6cbcb;
}
a:hover,
a:active,
a:visited {
    text-decoration: none;
}

p {
    word-break: break-all !important;
    word-wrap: break-word !important;
}

img {
    max-width: 100%;
    height: auto;
}

embed,
iframe,
object {
    max-width: 100%;
}

address {
    font-style: normal;
}

ul,ol {
    padding-left: 1.5rem;
}

/* link
-------------------------------*/
a {
    color:#cc6868;
    text-decoration: none;
}

/* font
-------------------------------*/
.font_m {
    font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
    font-style: normal;
    font-weight: 600;
}

/* スマホ・PC
-------------------------------*/
.pc {
    display: none!important;
}
.mobile_br {
    display: block;
}

@media only screen and (min-width: 768px) , print {
    .mobile_br {
        display: inline-block;
    }
}
@media only screen and (min-width: 1024px) , print {
    html {
        scroll-padding-top:160px;
        font-size: 16px;
    }
    .pc {
        display: inherit!important;
    }
    .mobile {
        display: none!important;
    }
}

/* widthなど
-------------------------------*/
.w_60 {
    width: 60px!important;
}
.w_80 {
    width: 80px!important;
}
.w_100 {
    width: 100px!important;
}
.w_120 {
    width: 120px!important;
}
.w_180 {
    width: 180px!important;
}
.w_200 {
    width: 200px!important;
}
.w_240 {
    width: 240px!important;
}
.w_260 {
    width: 260px!important;
}
.w_320 {
    width: 100%;
    max-width: 320px!important;
}
.w_max-content {
    max-width: max-content;
}
.w_30per {
    width: 30%!important;
}
.w_50per {
    width: 50%!important;
}
.w_auto {
    width: auto!important;
}

/* space
-------------------------------*/
.mt_m {
    margin-top: clamp(36px , 6vw , 72px)!important;
}
.mb_m {
    margin-bottom: clamp(36px , 6vw , 72px)!important;
}
.mt_ml {
    margin-top: clamp(48px , 8vw , 100px)!important;
}
.mb_ml {
    margin-bottom: clamp(48px , 8vw , 100px)!important;
}
.mt_l {
    margin-top: clamp(64px , 10vw , 160px)!important;
}
.mb_l {
    margin-bottom: clamp(64px , 10vw , 160px)!important;
}
.pt_m {
    padding-top: clamp(36px , 6vw , 72px)!important;
}
.pb_m {
    padding-bottom: clamp(36px , 6vw , 72px)!important;
}
.pt_ml {
    padding-top: clamp(48px , 8vw , 100px)!important;
}
.pb_ml {
    padding-bottom: clamp(48px , 8vw , 100px)!important;
}
.pt_l {
    padding-top: clamp(64px , 10vw , 160px)!important;
}
.pb_l {
    padding-bottom: clamp(64px , 10vw , 160px)!important;
}

/* border
-------------------------------*/
.border01 {
    border: 1px solid;
}
.border_b_01 {
    border-bottom: 1px solid;
}
.border_t_01 {
    border-top: 1px solid;
}
.border_gray {
    border-color: #e5e7eb;
}

/* background
-------------------------------*/
.bg_white {
    background-color: #fff!important;
}
.bg_black {
    background-color: #222222!important;
}
.bg_gray {
    background-color: rgb(250, 250, 250)!important;
}
.bg_light_red {
    background-color: #f9f1f1!important;
}
.bg_facebook {
    background-color: #3b5998!important;
}
.bg_line {
    background-color: #00c300!important;
}

/* text
-------------------------------*/
.ib {
    display: inline-block;
}
.black {
    color: #000!important;
}
.black2 {
    color: #333!important;
}
.gray {
    color: #999!important;
}
.white:not(.bg_white) {
    color: #fff!important;
}
.red {
    color: #ad0f0f!important;
}
.red2 {
    color: #cc6868!important;
}

.underline {
    text-decoration: underline;
}
.nowrap {
    white-space: nowrap;
}
.fw {
    font-weight: 700;
}
.fw500 {
    font-weight: 500;
}
.fw400 {
    font-weight: 400;
}

.f10 {
    font-size: 10px;
}
.f12 {
    font-size: 12px;
}
.f14 {
    font-size: 14px;
}
.f16 {
    font-size: 16px;
}
.f18 {
    font-size: 18px;
}
.f20 {
    font-size: 20px;
}
.f24 {
    font-size: 24px;
}
.fs_xs {
    font-size:min(3.4666vw , 14px);
}
.fs_s {
    font-size:min(3.7333vw , 16px);
}
.fs_m {
    font-size: min(4.26666vw , 18px);
}
.fs_ml {
    font-size: min(4.8vw , 20px);
}
.fs_l {
    font-size: min(4.8vw , 24px);
}
.fs_xl {
    font-size: min(6.4vw , 34px);
}

.lh_1 {
    line-height: 1;
}
.lh_13 {
    line-height: 1.33333;
}
.lh_14 {
    line-height: 1.4;
}
.lh_2 {
    line-height: 2;
}
.align-middle {
    vertical-align: middle;
}
.pointer {
    cursor: pointer;
}
.list-disc {
    list-style: disc;
}

/* wrapper
-------------------------------*/
.container {
    padding-left: 20px;
    padding-right: 20px;
}
.wrapper {
    max-width: 890px;
    margin-left: auto;
    margin-right: auto;
}
.wrapper2 {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}
.wrapper3 {
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}


/* リキャプチャ表示隠す
---------------------*/
.grecaptcha-badge { visibility: hidden; }


/* --------------------------------------------
 header
--------------------------------------------*/
:root {
    --header_height: 60px;
}
.header {
    position: absolute;
    z-index: 1100;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--header_height);
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(255,255,255,0.3);
}
.header::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    background-color: rgba(221,141,141,1);
    transition: 0.6s;
}
.header.is-fixed {
    position: fixed;
}
.header.is-fixed::after {
    height: calc(100% + 1px);
}
.header_logo {
    position: absolute;
    left: 20px;
    width: 100px;
    z-index: 3;
}
.head_menu_btn {
    position: absolute;
    right: 0;
    z-index: 3;
}
.menu_open {
    background: none;
    border: 0;
    padding: 0;
    width:  var(--header_height);
    height:  var(--header_height);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.menu-overlay {
    position: fixed;
    inset: 0;
}
#global-menu {
    position: fixed;
    z-index: 9999;
    top: 0;
    height: 100%;
    right: -432px;
    width: 400px;
    max-width: 80%;;
    transition: 0.3s;
    box-shadow: -5px 0 20px 0 rgba(0,0,0,0.4);
    color: #ffffff;
    background: #8c8c8c;
}
.is-menu_open #global-menu {
    right: 0;
}
#global-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
}
#global-menu li {
    border-bottom: 1px solid #ddd;
}
#global-menu a {
    color: #ffffff;
    display: block;
    padding: 20px;
    font-size: 13px
}
#global-menu a:hover,
#global-menu a.active {
    color: #222;
}

.head_img_area {
    position: relative;
    height: min(64vw , 400px);
    background-color: #222;
    display: flex;
    align-items: center;
    justify-content: center;
}
.head_title {
    position: relative;
    z-index: 3;
    text-align: center;
    background: rgba(255,255,255,0.8);
    padding: min(5.3333333vw, 36px);
    min-width: min(64vw, 480px);
    max-width: 80%;
    line-height: 1.25;
}
.head_title > img {
    margin-bottom: 12px;
    max-width: 108px;
}
.page_title {
    font-size: min(5.33333333vw , 40px);
    line-height: 1.4;
}
.head_text {
    margin-top: min(1.0666666666vw , 20px);
    font-size: min(3.73333333vw , 16px);
}
.head_img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.head_img::after {
    content: "";
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.3);
    pointer-events: none;
}
.head_img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.breadcrumb_area {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 3;
    width: 100%;
    border-top: 1px solid rgba(255,255,255,0.3);
    color: #fff;
    overflow: hidden;
    height: var(--header_height);
}
.breadcrumb_area > div {
    height: 100%;
    display: flex;
    align-items: center;
}
#breadcrumbs {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#breadcrumbs > span {
    display: flex;
    gap: min(2.13333333vw , 12px);
    font-size: 12px;
}
#breadcrumbs a,
#breadcrumbs .breadcrumb_last {
    color: #fff;
    padding: 12px 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap:  min(2.13333333vw , 12px);
}
#breadcrumbs a::after {
    content: "";
    width: 12px;
    height: 12px;
    background: url("img/arrow-right.svg") no-repeat center / contain;
}
#breadcrumbs > span > span:first-child a {
    background: url("img/home.svg") no-repeat left / 12px;
    width: 32px;
    text-indent: -9999px;
    overflow: hidden;
    white-space: nowrap;
}

@media only screen and (min-width: 1152px) , print {
    :root {
        --header_height: 70px;
    }
    .header::after {
        background-color: rgba(204,104,104,1);
    }
    .head_menu_btn {
        display: none;
    }
    #global-menu {
        position: static;
        background: none;
        width: 100%;
        margin: auto;
        box-shadow: none;
    }
    #global-menu ul {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
    }
    #global-menu li {
        border: 0;
    }
    #global-menu a {
        font-size: 14px;
        font-weight: 700;
    }
}

/* --------------------------------------------
 footer
--------------------------------------------*/
.footer_content {
    background: linear-gradient(rgba(0,0,0,0.3), rgba(0,0,0,0.3)), url(img/footer_bg.jpg) no-repeat center top;
    background-size: cover;
    min-height: 480px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.footer_content_title {
    font-size: 20px;
}
.footer_content .btn {
    width: 300px;
    margin-top: min(3.2vw , 32px);
}
.footer_bottom {
    padding: 68px 0 40px;
}
.footer_bottom_title {
    font-size: 15px;
}
.footer_sns {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}
.copyright {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.totop {
    position:fixed;
    right:0px;
    bottom:0px;
    z-index:999;
    transform: translate3d(0,100%,0);
    transition: all 0.35s;
}
.totop.active {
    transform: translate3d(0,0,0);
}
.totop a {
    background: #b75959;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
    width: 60px;
    text-decoration: none;
    z-index: 100;
    position: relative;
}

@media only screen and (min-width: 768px) , print {
    .footer_content_title {
        font-size: 34px;
    }
    .footer_bottom_title {
        font-size: 18px;
    }
}
@media only screen and (min-width: 1152px) , print {
    .footer {
        position: relative;
    }
    .footer_bottom {
        padding: 0;
        height: 100px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .footer_sns {
        position: absolute;
        right: 28px;
        margin-top: 0;
        line-height: 1;
    }
}

/* --------------------------------------------
 main
--------------------------------------------*/
.site-content {
    padding: min(10.666666vw , 120px ) 0 min(10.666666vw , 160px );
}


/*ボタン*/
.btn {
    background-color: #b75959;
    color: #fff;
    padding: 12px 20px;
    text-align: center;
    display: inline-block;
    text-decoration: none;
    border: 0;
    transition: 0.3s;
    cursor: pointer;
    border-radius: 60px;
    font-weight: 600;
    transition: all 0.35s ease;
}
.btn-primary:hover {
    background-color: #ad0f0f;
}
.btn-default {
    background: #fff;
    color: inherit;
    border: 1px solid;
}
.btn-default:hover {
    color: #b75959;
}
.btn-sub {
    background-color: #f7f7f7;
    color: inherit;
    padding: 4px 16px;
    border-radius: 20px;
}
.btn-block {
    display: block;
}
.btn-text {
    background: none;
    border: 0;
    padding: 0;
}
.btn:disabled ,
.btn:disabled:hover {
    background-color: #c6cbcb;
    cursor: auto;
}

/*フォーム*/
.required {
    color: #ad0f0f;
    font-weight: normal;
    display: inline-block;
    font-size: 11px;
}
.required i.fa-asterisk {
    position: relative;
}
.required i.fa-asterisk:after {
    content: "必須";
    line-height: 1;
    font-style: normal;
}

input[type=color],
input[type=datetime],
input[type=number],
input[type=search],
input[type=tel],
input[type=email],
input[type=text],
input[type=url],
input[type=password],
select,
textarea {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 12px 24px;
    font-family: Arial, "Hiragino Sans", "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    max-width: 100%;
}
textarea {
    width: 100%;
}
input[type=color]:focus,
input[type=datetime]:focus,
input[type=number]:focus,
input[type=search]:focus,
input[type=tel]:focus,
input[type=email]:focus,
input[type=text]:focus,
input[type=url]:focus,
input[type=password]:focus,
textarea:focus {
    outline-color: #b75959;
}

.recaptcha_text {
    font-size: 12px;
    text-align: center;
}
.recaptcha_text a {
    color: inherit;
}

.error_messe {
    color: #ad0f0f;
}

/*テーブル*/
table {
    border-top: 1px solid #dddddd;
}
table tr {
    border-bottom: 1px solid #dddddd;
}
table th,
table td {
    font-weight: 400;
    padding: min(3.2vw , 20px) 0;
    text-align: left;
    font-family: var(--font-family-gothic);
}
table th {
    font-weight: 700;
}
table td {
    color: #333;
}
.table_wrap {
    overflow: auto;
    white-space: nowrap;
    margin-bottom: 2em;
}
.responsive_table,
.responsive_table tbody,
.responsive_table td,
.responsive_table th,
.responsive_table tr {
    display: block;
    width: 100%;
    text-align: left;
}
.responsive_table th {
    padding-bottom: 0;
    padding-top: 24px;
}
@media only screen and (min-width: 540px),print {
    .responsive_table {
        display:table;
        table-layout: fixed
    }

    .responsive_table tbody {
        display: table-row-group
    }

    .responsive_table tr {
        display: table-row;
        background-size: 100% 1px
    }

    .responsive_table td,.responsive_table th {
        display: table-cell
    }

    .responsive_table th {
        width: 32%;
        color: inherit;
        padding: min(3.2vw , 20px) 0;
    }
}
@media only screen and (min-width: 768px),print {
    .table_wrap {
        white-space: initial;
    }
}

/*wpギャラリー*/
.gallery {
    padding-bottom: 1.5em;
    display: grid;
    grid-column-gap:2%;
    grid-row-gap:10px;
}
.gallery-columns-2 {
    grid-template-columns: 1fr 1fr;
}
.gallery-columns-3 {
    grid-template-columns: 1fr 1fr 1fr;
}
.gallery-columns-4 {
    grid-template-columns: 1fr 1fr 1fr 1fr;
}
.gallery-columns-5 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}
.gallery-columns-6 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.gallery-columns-7 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
.gallery-columns-8{
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
.gallery-columns-9 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}
.gallery-item {
    text-align: center;
    width: 100%;
    height: 100%;
}
.gallery-item a {
    display: block;
    width: 100%;
    height: 100%;
}
.gallery-item img {
    display: block;
    margin: 0 auto;
}
.gallery-caption {
    display: block;
    font-size: 0.78rem;
    padding: 0.5rem 0 1rem;
    line-height: 1.25;
    white-space: normal;
    word-break: break-all;
    text-align: left;
}


/*カルーセル・スライドショー*/
.swiper_area {
    position: relative;
}
.swiper-pagination .swiper-pagination-bullet {
    background: #222;
}
.swiper-pagination .swiper-pagination-bullet-active {
    background:#5ec0c1;
}
.swiper_area .swiper-button {
    background: #fff;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.15);
    border-radius: 100px;
    width: 36px;
    height: 36px;
    font-size: 10px;
    display: flex;
}
.swiper-button.swiper-button-next:after,
.swiper-button.swiper-button-prev:after {
    font-size: 14px;
    color: #b75959;
}
.swiper-pagination_small {
    padding-bottom: 40px;
}
.swiper-pagination_small .swiper-pagination {
    bottom: 28px;
    text-align: right;
}
.swiper-pagination_small .swiper-pagination-bullet {
    width: 4px;
    height: 4px;
}
.swiper_autoplay .swiper-wrapper {
    transition-timing-function:linear;
}

/*youtube*/
.video-container iframe {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

/*検索入力*/
.search-form > div {
    position: relative;
    display: flex;
    align-items: center;
}
input[type=text].search-field {
    background: #f7f7f7;
    border: 0;
    width: 100%;
}
.search-submit {
    position: absolute;
    background: none;
    border: 0;
    right: 12px;
    padding: 0;
    display: flex;
}

/*ページ送り*/
.pagination {
    text-align:center;
    margin:2em auto;
    font-size:16px;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 4px;
}
.pagination > a {
    flex: 1;
}
.page_current,
.inactive {
    display: none!important;
}
.pagination_num {
    flex: 2;
    font-size: 12px;
    border: 1px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pagination a,
.page_current {
    color: #fff;
    background: #dd8d8d;
    font-size: 12px;
    text-decoration: none;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    border-radius: 4px;
}
.page_current {
    background:#fff;
    border:1px solid #dd8d8d;
    color: #dd8d8d;
}
.page_next,
.page_prev {
    padding:2px 18px;
}
@media only screen and (min-width: 768px) , print {
    .pagination a {
        flex: none;
    }
    .page_current,
    .inactive {
        display: block!important;
    }
    .pagination_num {
        display: none!important;
    }
}

/* \/みたいな吹き出し*/
.fukidashi01 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
}
.fukidashi01::before {
    content: "";
    width: 30px;
    height: 2px;
    transform: rotate(60deg);
    box-sizing: border-box;
    background-color: #000;
}
.fukidashi01::after {
    content: "";
    width: 30px;
    height: 2px;
    transform: rotate(-60deg);
    box-sizing: border-box;
    background-color: #000;
}

/*アニメーション*/
/*ふわっと表示*/
.fadein {
    opacity: 0;
    transition: 2.4s;
}
.fadein.animation_in {
    opacity: 1;
}
/*拡大からふわっと表示*/
.expand_fadein {
    overflow: hidden;
}
.expand_fadein img {
    opacity: 0;
    transform:scale(1.2 , 1.2);
    transition: 6.4s ease;
}
.expand_fadein.animation_in img {
    opacity: 1;
    transform:scale(1 , 1);
}
/*下から表示*/
.slideup {
    opacity: 0;
    transition: 1.6s ease;
    transform:translate(0, min(8.53333vw , 60px));
}
.slideup.animation_in {
    opacity: 1;
    transform:translate(0,0);
}
/*上から表示*/
.slidedown {
    opacity: 0;
    transition: 1.6s ease;
    transform:translate(0, min(8.53333vw , -60px));
}
.slidedown.animation_in {
    opacity: 1;
    transform:translate(0,0);
}

.delay01 {
    transition-delay: 0.8s;
}
.delay02 {
    transition-delay: 1.6s;
}



/* --------------------------------------------
 トップページ
--------------------------------------------*/
.home .header {
    background-color: rgba(221,141,141,1);
}
.top_main {
    padding-top: var(--header_height);
}
.top_worries {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.top_worries li {
    font-weight: 700;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1.25;
    font-size: 14px;
    margin: auto;
    padding: 20px 12px;
    border-width: 12px;
    border-style: solid;
    border-image-source: url(img/top/worries.svg);
    border-image-slice: 8 fill;
    border-image-repeat: stretch;
    max-width: 360px;
    min-height: 120px;
}
.top_about {
    display: grid;
    gap: 20px;
}
.top_about_img {
    position: relative;
    overflow: hidden;
}
.top_about_img:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0) 40%);
    pointer-events: none;
}
.top_about img {
     border-radius: 20px;
}
.top_course_1,
.top_course_2 {
    display: grid;
    gap: 12px;
}
.top_course {
    border: 1px solid #cc6868;
    border-radius: 16px;
    display: grid;
    gap: 12px;
    align-items: center;
    position: relative;
    color: inherit;
    padding: 16px 24px 16px 16px;
    line-height: 1.4;
    font-size: 14px;
    box-shadow: 0 0 8px rgba(0,0,0,0.15);
}
.top_course:has(> :nth-child(2)) {
    grid-template-columns: 1fr 2fr;
}
.top_course:hover {
    box-shadow: 0 0 16px rgba(0,0,0,0.2);
}
.top_course_ico1 {
    position: absolute;
    right: -20px;
    top: -20px;
    width: 60px;
}
.top_course_ico2 {
    position: absolute;
    right: -1px;
    top: -1px;
    width: 60px;
}
.top_course_title {
    margin-bottom: 8px;
    font-size: 18px;
    line-height: 1.25;
    color: #cc6868;
}

.top_reason_wrap {
    display: grid;
    gap: 20px;
}
.top_reason {
    display: grid;
    justify-content: center;
    line-height: 1.4;
}
.top_reason_num {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #cc6868;
    border-radius: 32px;
    margin: auto;
    line-height: 1;
    border: 1px solid #cc6868;
}
.top_contact_wrap {
    display: grid;
    gap: 28px;
}
.top_contact {
    border-radius: 20px;
    padding: 20px 20px 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
    position: relative;
    line-height: 1.25;
}
.top_contact::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    border-style: solid;
    border-width: 20px 10px 0 10px;
    border-color: #ffffff transparent transparent;
    translate: -50% 100%;
}
.top_contact img {
    max-height: 140px;
    object-fit: contain;
}

.top_blog {
    border-bottom: 1px solid #ddd;
    padding: 8px 0;
    line-height: 1.4;
    display: grid;
    grid-template-columns: min(32vw , 180px) 2fr;
    gap: 20px;
    align-items: center;
}

@media only screen and (min-width: 768px) , print {
    .top_worries li {
        padding: 20px 40px;
        font-size: 16px;
    }
    .top_about {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .top_course_1,
    .top_course_2 {
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }
    .top_reason_wrap {
        grid-template-columns: 1fr 1fr 1fr;
        gap: min(5.208333vw , 80px);
    }
    .top_reason img {
        aspect-ratio: 81/53;
        object-fit: contain;
    }
    .top_contact_wrap{
        grid-template-columns: 1fr 1fr 1fr;
    }
}
@media only screen and (min-width: 1152px) , print {
    .home .header {
        background-color: rgba(204,104,104,1);
    }
    .top_worries {
        column-gap: 600px;
    }
    .top_solution {
        width: 600px;
        margin-top: -400px;
        margin-left: auto;
        margin-right: auto;
    }
    .top_worries li:nth-child(2n + 1) {
        margin-right: 0;
    }
    .top_worries li:nth-child(2n) {
        margin-left: 0;
    }
}

/* --------------------------------------------
 VALLA NAIL® Academyとは
--------------------------------------------*/
.about_safety {
    display: grid;
    gap: 40px;
    margin-top: min(7.4666666666vw , 60px);
}
.about_safety img {
    width: 200px;
    height: 160px;
    object-fit: contain;
}
.about_student_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 4px 20px;
    margin-top: min(5.33333333vw , 40px);
}
.about_student {
    border: 1px solid #dd8d8d;
    padding: 20px;
    aspect-ratio: 1 / 1;
    text-align: center;
    line-height: 1.4;
    border-radius: 100px;
    width: min(32vw , 180px);
    height: min(32vw , 180px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.about_point_wrap {
    display: grid;
    gap: min(2.1333333vw , 40px);
}
.about_point {
    border: 1px solid #f9f1f1;
    border-radius: 20px;
    overflow: hidden;
}
.about_point_text {
    background-color: #f9f1f1;
    padding: min(5.333333vw , 40px) min(3.2vw , 40px);
    line-height: 1.4;
}
.about_support {
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #ddd;
}
.about_support_title {
    margin-bottom: 20px;
}

@media only screen and (min-width: 768px) , print {
    .about_safety {
        grid-template-columns: 1fr 1fr 1fr;
        gap: min(6.25vw , 80px);
    }
    .about_point {
        display: grid;
        grid-template-columns: 1fr 1.6fr;
    }
    .about_point_text {
        display: flex;
        flex-direction: column;
        justify-content: center;
        height: 100%;
    }
    .about_support {
        display: grid;
        grid-template-columns: 3fr 1.2fr;
        align-items: center;
        gap: 40px;
    }
    .about_support_img {
        padding: 20px;
    }
}

/* --------------------------------------------
 講習コース
--------------------------------------------*/
.course {
    display: grid;
    gap: min(4.266666vw , 40px);
    margin-bottom: min(6.4vw , 40px);
    padding-bottom: min(6.4vw , 40px);
    border-bottom: 1px solid #ddd;
}
.course_img {
    max-width: 240px;
}
.course_title {
    font-size: min(6.4vw , 32px);
    margin-bottom: min(3.2vw, 32px);
    line-height: 1.4;
}
.course_text {
    display: grid;
    line-height: 1.6;
}
.course_text dt {
    font-weight: 700;
    font-size: 14px;
}
.course_text dd {
    margin-bottom: 8px;
}
.course_note {
    padding: 8px;
    border-radius: 4px;
    background: #f9f1f1;
    margin-top: 4px;
    line-height: 1.4;
    font-size: min(3.4666666vw, 14px);
}

.course_info {
    padding: min(5.333333vw , 40px) min(10.6666666vw , 80px);
    border-radius: 20px;
}

.simulation_text {
    padding: 20px 0;
}
.simulation_time {
    background-color: #f9f1f1;
    padding: 0 8px;
    border-radius: 20px;
}
.simulation_add {
    position: relative;
    padding: 0 8px;
    border-radius: 20px;
    background-color: #f5f5f5;
    margin-left: 4px;
}
.simulation_add::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 2px;
    border-style: solid;
    border-width: 8px 12px 8px 0;
    border-color: transparent #f5f5f5 transparent transparent;
    translate: -100% -50%;
}
.simulation_count {
    display: grid;
    gap: 8px;
}
.price_list {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.price_list .total {
    border-top: 1px solid #ddd;
}
.simulation_count > div {
    background: #f5f5f5;
    padding: 20px 20px 12px;
    border-radius: 20px;
}
.simulation_count > div.simulation_count02 {
    background: #f9f1f1;
}

.kit_wrap {
    display: grid;
    gap: 20px;
}
.kit_box {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 20px;
    line-height: 1.4;
}
.kit_box ul {
    list-style: square;
    margin: 0;
}
.kit_box ul li {
    font-size: 14px;
    margin-bottom: 4px;
    line-height: 1.25;
}

@media only screen and (min-width: 768px) , print {
    .course {
        grid-template-columns: 1fr 2fr;
        align-items: center;
    }
    .course_noimage {
        grid-template-columns: 1fr;
    }
    .course_img {
        max-width: 100%;
    }
    .course_text {
        grid-template-columns: auto 3fr;
        gap: min(2.1333333vw, 20px);
    }
    .course_text dd {
        margin-bottom: 0;
    }
    .simulation {
        display: grid;
        grid-template-columns: 2fr 3fr;
        align-items: center;
        gap: 20px;
    }
    .simulation_count {
        grid-template-columns: 1fr 1fr;
        margin-top: 16px;
    }
}
@media only screen and (min-width: 1024px) , print {
    .kit_wrap {
        grid-template-columns: 2fr 1.8fr;
        gap: 40px;
    }
}

/* --------------------------------------------
 academy 認定校 インストラクター
--------------------------------------------*/
/*academy一覧*/
.academy_wrap {
    border: 1px solid #ddd;
    position: relative;
    margin-top: -1px;
}
.academy_cate {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 2;
}
.academy_cate a {
    background-color: #fff;
    font-size: 11px;
    min-width: 90px;
    display: inline-block;
    padding: 8px 20px;
    text-align: center;
    border-radius: 40px;
    line-height: 1.25;
    color: inherit;
}
.academy_cate a:hover {
    color: #ad0f0f;
}
.academy {
    color: inherit;
    overflow: hidden;
    display: block;
}
.academy:hover {
    color: #ad0f0f;
}
.academy_img {
    aspect-ratio: 4/3;
    object-fit: cover;
    display: block;
    width: 100%;
    transition: 0.3s;
}
.academy:hover .academy_img {
    transform: scale(1.15);
}
.academy_text {
    padding: min(4.2666666vw , 32px) 20px;
    background: #fff;
    position: relative;
}
.academy_catch {
    font-size: min(4vw , 18px);
}
.academy_title {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

@media only screen and (min-width: 768px) , print {
    .academy_area {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .academy_wrap:nth-child(2n) {
        border-left: 0;
    }
    .academy_cate a {
        font-size: 12px;
    }
}

/*academy詳細*/
.head_img_academy_single {
    height: 120px;
}
.head_img_academy_single .breadcrumb_area {
    border-top:0;
}
.academy_detail_img .academy_text {
    position: absolute;
    z-index: 2;
    left: 0;
    bottom: 0;
    width: 100%;
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
}
.academy_detail_img .academy_catch {
    font-size: min(4vw , 34px);
}

.styled_h3 {
    font-size: 22px;
    text-align: left;
    color: #000000;
    border-top: 0px solid #dddddd;
    border-bottom: 0px solid #dddddd;
    border-left: 2px solid #000000;
    border-right: 0px solid #dddddd;
    padding: 6px 0px 6px 16px;
    margin: 0px 0px 30px;
}
.post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h2, .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h3, .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h4, .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h5, .post_content :not(h2):not(h3):not(h4):not(h5):not(h6) + h6 {
    margin-top: 30px !important;
}
.post_content p {
    line-height: 2;
}

.post_content table {
    margin: 0 0 24px 0;
    width: 100%;
}
.post_content td, .post_content th {
    line-height: 1.8;
    padding: 14px 20px;
    border: 1px solid #ddd;
    background: #fff;
}
.post_content a {
    color: #000000;
}

.post_row {
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
    display:block;
    line-height:2;
}
.post_col {
    margin-bottom:2em;
    flex: 1 1 0%;
}
.post_col-2 {
    margin-right:0px;
}
.post_col-3 {
    margin-right:0px;
}
.post_col:last-of-type {
    margin-right:0;
}
.q_button_wrap {
    text-align: center;
    margin: 2em auto;
}
.q_custom_button {
    color: #fff;
    border: 1px solid #000;
    font-size: 100%;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    overflow: hidden;
    position: relative;
    z-index: 2;
    max-width: 100%;
    padding: 0 30px;
    margin: 0;
    text-decoration: none;
    box-sizing: border-box;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    transition: all 0.2s ease;
}
.q_custom_button2.animation_type1 {
    background:#535353;
}
.q_custom_button2 {
    color: #ffffff !important;
    border-color: rgba(83, 83, 83, 1);
}
.q_custom_button2:hover, .q_custom_button2:focus {
    color:#ffffff !important;
    border-color:rgba(125,125,125,1);
}

@media only screen and (min-width: 768px) , print {
    .post_row {
        line-height: 2.4;
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .post_col {
        flex: 1 1 0%;
    }
    .post_col-2 {
        margin-right:50px;
    }
    .post_col-3 {
        margin-right: 25px;
    }
}
@media only screen and (min-width: 1152px) , print {
    .head_img_academy_single {
        height: 140px;
    }
}


/* --------------------------------------------
 FAQ
--------------------------------------------*/
.faq_area {
    display: grid;
    margin-left: -20px;
    margin-right: -20px;
}
.faq_category {
    margin-bottom: min(10.6666666vw , 80px);
}
.faq_category_title {
    margin-bottom: min(5.33333333vw , 40px);
    font-size: min(5.33333333vw , 34px);
}
/*アコーディオンみたいなクリックで表示・非表示*/
.accordion {
    border-bottom: 1px solid #ddd;
}
.accordion:first-of-type {
    border-top: 1px solid #ddd;
}
.accordion_head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    cursor: pointer;
    padding: 20px;
}
.accordion_head:hover {
    color: #b75959;
}
.accordion_head.open {
    color: #b75959;
    border-bottom: 1px solid #ddd;
}
.accordion_head .accordion_minus {
    display: none;
}
.accordion_head.open .accordion_minus {
    display: inherit;
}
.accordion_head.open .accordion_plus {
    display: none;
}
.accordion_body {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: 0.5s;
    padding: 0 20px;
}
.accordion_body > * {
    overflow: hidden;
}
.accordion_head.open + .accordion_body {
    opacity: 1;
    grid-template-rows: 1fr;
    padding-bottom: min(5.3333vw, 40px);
    padding: 16px 20px;
}

.faq_title {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
}

@media only screen and (min-width: 768px) , print {
    .faq_area {
        margin-left: auto;
        margin-right: auto;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 40px;
    }
    .accordion {
        border-left: 1px solid #ddd;
        border-right: 1px solid #ddd;
    }
    .faq_title {
        font-size: 16px;
    }
}


/* --------------------------------------------
 お問い合わせ
--------------------------------------------*/
.wpforms-form button[type=submit] {
    background-color: #cc6868 !important;
    border-color: #cc6868 !important;
}
 
.wpforms-form button[type=submit]:hover {
    background-color: #AD0F0F !important;
}



/* --------------------------------------------
 ブログ
--------------------------------------------*/
/*ブログ一覧*/
.news_list_area {
    display: grid;
    gap: 20px;
}
.news_list {
    display: grid;
    border: 1px solid #ddd;
    background: #fff;
}
.news_list img {
    width: 100%;
    aspect-ratio: 17/8;
    object-fit: cover;
}
.news_text {
    padding: 16px 20px;
}
.news_title {
    font-size: 16px;
}

/*ブログ詳細*/
.entry_title {
    font-size: min(7.4666666vw, 40px);
    line-height: 1.4;
}
.entry-content h1 ,
.entry-content h2 {
    font-size: min(5.86666vw, 22px);
    font-weight: 700;
    border-bottom: 2px solid #000000;
    border-top: 2px solid #000000;
    padding: 16px 0;
    margin: 40px 0px 20px;
    line-height: 1.4;
}
.entry-content h3 {
    font-size: min(4.8vw , 20px);
    text-align: left;
    border-bottom: 1px solid #000000;
    padding: 8px 0;
    margin: 28px 0px 12px;
    line-height: 1.4;
}
.entry-content h4 {
    font-size: min(4.26666vw , 18px);
    font-weight: 700;
    padding: 4px 0px;
    margin: 20px 0px 8px;
    line-height: 1.4;
}
.has-small-font-size  {
    font-size: 14px!important;
}
.entry-content blockquote {
    background-color: #f5f5f5;
    padding: 20px;
    border-radius: 8px;
    position: relative;
}
.entry-content  blockquote:after {
    content: "”";
    position: absolute;
    top: 0;
    right: 10px;
    line-height: 1;
    font-size: 85px;
    color: #ddd;
}

.cat_list {
    margin-left: 4px;
    padding-left: 4px;
    border-left: 1px solid #ddd;
}
.cat_list a {
    color: #999;
    display: inline-block;
    margin-right: 8px;
}
.news_prev_next {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 8px;
    padding-top: 40px;
    border-top: 1px solid #ddd;
    margin-top: 40px;
}
.news_prev_next > div {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
}
.news_prev_next > div.next {
    justify-content: flex-end;
}
.news_prev_next > div svg {
    flex: none;
}



@media only screen and (min-width: 768px) , print {
    .news_list_area {
        grid-template-columns: 1fr 1fr;
    }
    .news_title {
        font-size: 18px;
    }
    .news_prev_next {
        gap: 20px;
    }
    .news_prev_next > div {
        font-size: 14px;
    }
    .has-small-font-size  {
        font-size: 16px!important;
    }
}