/*
Theme Name: rotw
Author: K.shinohara
*/
@charset "utf-8";

:root {
    --color: #eb6174;
    --color1: #eb6174;
    --color2: #af8453;
    --color3: #b5b5b5;
    --color4: #3e3e3e;
    --color5: #738390;
    --color6: #050c19;
    --color7: #ff008c;
    --color8: ;
    --color9: ;

    --size5px: 5px;
    --size10px: 10px;
    --size15px: 15px;
    --size20px: 20px;
    --size25px: 25px;
    --size30px: 30px;
    --size35px: 35px;
    --size40px: 40px;
    --size45px: 45px;
    --size50px: 50px;
    --size55px: 55px;
    --size60px: 60px;
    --size65px: 65px;
    --size70px: 70px;
    --size75px: 75px;
    --size80px: 80px;
    --size85px: 85px;
    --size90px: 90px;
    --size95px: 95px;
    --size100px: 100px;
    --size105px: 105px;
    --size110px: 110px;
    --size115px: 115px;
    --size120px: 120px;
    --size125px: 125px;
    --size130px: 130px;
    --size135px: 135px;
    --size140px: 140px;
    --size145px: 145px;
    --size150px: 150px;
    --size160px: 160px;
    --size170px: 170px;
    --size180px: 180px;
    --size190px: 190px;
    --size200px: 200px;
    --size210px: 210px;
    --size220px: 220px;
    --size230px: 230px;
    --size240px: 240px;
    --size250px: 250px;
    --size260px: 260px;
    --size270px: 270px;
    --size280px: 280px;
    --size290px: 290px;
    --size300px: 300px;
    --size310px: 310px;
    --size325px: 325px;
    --size340px: 340px;
    --size355px: 355px;
    --size370px: 370px;
    --size385px: 385px;
    --size400px: 400px;
    --size420px: 420px;
    --size440px: 440px;
    --size460px: 460px;
    --size480px: 480px;
    --size500px: 500px;
}

@media(min-width: 768px) and (max-width:1280px) {
    :root {
        --size5px: calc(5 / 1280 * 100vw);
        --size10px: calc(10 / 1280 * 100vw);
        --size15px: calc(15 / 1280 * 100vw);
        --size20px: calc(20 / 1280 * 100vw);
        --size25px: calc(25 / 1280 * 100vw);
        --size30px: calc(30 / 1280 * 100vw);
        --size35px: calc(35 / 1280 * 100vw);
        --size40px: calc(40 / 1280 * 100vw);
        --size45px: calc(45 / 1280 * 100vw);
        --size50px: calc(50 / 1280 * 100vw);
        --size55px: calc(55 / 1280 * 100vw);
        --size60px: calc(60 / 1280 * 100vw);
        --size65px: calc(65 / 1280 * 100vw);
        --size70px: calc(70 / 1280 * 100vw);
        --size75px: calc(75 / 1280 * 100vw);
        --size80px: calc(80 / 1280 * 100vw);
        --size85px: calc(85 / 1280 * 100vw);
        --size90px: calc(90 / 1280 * 100vw);
        --size95px: calc(95 / 1280 * 100vw);
        --size100px: calc(100 / 1280 * 100vw);
        --size105px: calc(105 / 1280 * 100vw);
        --size110px: calc(110 / 1280 * 100vw);
        --size115px: calc(115 / 1280 * 100vw);
        --size120px: calc(120 / 1280 * 100vw);
        --size125px: calc(125 / 1280 * 100vw);
        --size130px: calc(130 / 1280 * 100vw);
        --size135px: calc(135 / 1280 * 100vw);
        --size140px: calc(140 / 1280 * 100vw);
        --size145px: calc(145 / 1280 * 100vw);
        --size150px: calc(150 / 1280 * 100vw);
        --size160px: calc(160 / 1280 * 100vw);
        --size170px: calc(170 / 1280 * 100vw);
        --size180px: calc(180 / 1280 * 100vw);
        --size190px: calc(190 / 1280 * 100vw);
        --size200px: calc(200 / 1280 * 100vw);
        --size210px: calc(210 / 1280 * 100vw);
        --size220px: calc(220 / 1280 * 100vw);
        --size230px: calc(230 / 1280 * 100vw);
        --size240px: calc(240 / 1280 * 100vw);
        --size250px: calc(250 / 1280 * 100vw);
        --size260px: calc(260 / 1280 * 100vw);
        --size270px: calc(270 / 1280 * 100vw);
        --size280px: calc(280 / 1280 * 100vw);
        --size290px: calc(290 / 1280 * 100vw);
        --size310px: calc(310 / 1280 * 100vw);
        --size325px: calc(325 / 1280 * 100vw);
        --size340px: calc(340 / 1280 * 100vw);
        --size355px: calc(355 / 1280 * 100vw);
        --size370px: calc(370 / 1280 * 100vw);
        --size385px: calc(385 / 1280 * 100vw);
        --size400px: calc(400 / 1280 * 100vw);
        --size420px: calc(420 / 1280 * 100vw);
        --size440px: calc(440 / 1280 * 100vw);
        --size460px: calc(460 / 1280 * 100vw);
        --size480px: calc(480 / 1280 * 100vw);
        --size500px: calc(500 / 1280 * 100vw);
    }
}

@media(max-width:767px) {
    :root {
        --size5px: calc(5 / 640 * 100vw);
        --size10px: calc(10 / 640 * 100vw);
        --size10px: calc(15 / 640 * 100vw);
        --size20px: calc(20 / 640 * 100vw);
        --size25px: calc(25 / 640 * 100vw);
        --size30px: calc(30 / 640 * 100vw);
        --size35px: calc(35 / 640 * 100vw);
        --size40px: calc(40 / 640 * 100vw);
        --size45px: calc(45 / 640 * 100vw);
        --size50px: calc(50 / 640 * 100vw);
        --size60px: calc(60 / 640 * 100vw);
        --size70px: calc(70 / 640 * 100vw);
        --size80px: calc(80 / 640 * 100vw);
        --size90px: calc(90 / 640 * 100vw);
        --size100px: calc(100 / 640 * 100vw);
        --size105px: calc(105 / 640 * 100vw);
        --size110px: calc(110 / 640 * 100vw);
        --size115px: calc(115 / 640 * 100vw);
        --size120px: calc(120 / 640 * 100vw);
        --size125px: calc(125 / 640 * 100vw);
        --size130px: calc(130 / 640 * 100vw);
        --size135px: calc(135 / 640 * 100vw);
        --size140px: calc(140 / 640 * 100vw);
        --size145px: calc(145 / 640 * 100vw);
        --size150px: calc(150 / 640 * 100vw);
        --size160px: calc(160 / 640 * 100vw);
        --size170px: calc(170 / 640 * 100vw);
        --size180px: calc(180 / 640 * 100vw);
        --size190px: calc(190 / 640 * 100vw);
        --size200px: calc(200 / 640 * 100vw);
        --size210px: calc(210 / 640 * 100vw);
        --size220px: calc(220 / 640 * 100vw);
        --size230px: calc(230 / 640 * 100vw);
        --size240px: calc(240 / 640 * 100vw);
        --size250px: calc(250 / 640 * 100vw);
        --size260px: calc(260 / 640 * 100vw);
        --size270px: calc(270 / 640 * 100vw);
        --size280px: calc(280 / 640 * 100vw);
        --size290px: calc(290 / 640 * 100vw);
        --size300px: calc(300 / 640 * 100vw);
        --size310px: calc(310 / 640 * 100vw);
        --size325px: calc(325 / 640 * 100vw);
        --size340px: calc(340 / 640 * 100vw);
        --size355px: calc(355 / 640 * 100vw);
        --size370px: calc(370 / 640 * 100vw);
        --size385px: calc(385 / 640 * 100vw);
        --size400px: calc(400 / 640 * 100vw);
        --size420px: calc(420 / 640 * 100vw);
        --size440px: calc(440 / 640 * 100vw);
        --size460px: calc(460 / 640 * 100vw);
        --size480px: calc(480 / 640 * 100vw);
        --size500px: calc(500 / 640 * 100vw);
    }
}


html,
body {
    line-height: 2 !important;
    letter-spacing: .1em;
    font-family: 'BIZ UDPGothic', sans-serif;
    font-size: 17px;
    overflow: auto;
}

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

li {
    list-style: none;
}

table {
    table-layout: fixed;
}

a {
    color: inherit;
}

#wrap {
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.flex {
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-start;
}

.flex.ccc {
    align-items: center;
    justify-content: center;
    text-align: center;
}

.flex.cc {
    align-items: center;
    justify-content: center;
}

.mgn-auto {
    margin: auto;
}

.mgn-auto-y {
    margin-left: auto;
    margin-right: auto;
}

.mgn-auto-l {
    margin-left: auto
}

.mgn-auto-r {
    margin-right: auto;
}

.turn-up {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}

.txet-vertical {
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
}

.text-marker-yellow {
    background: linear-gradient(transparent 40%, #fff100 40%);
}



@media (min-width: 768px) {
    a[href^="tel:"] {
        cursor: default !important;
        pointer-events: none !important;
        text-decoration: none !important;
    }

    a[href^="tel:"]:hover {
        opacity: 1;
    }

    .sp-only {
        display: none;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {

    html,
    body {
        font-size: min(calc(17 / 1000 * 100vw), 17px);
        line-height: 1.8;
        letter-spacing: .06em;
    }
}

@media(max-width: 767px) {

    html,
    body {
        line-height: 1.75;
        letter-spacing: .02em;
        font-size: 15.5px;
    }

    .pc-only {
        display: none;
    }

    .mgn-auto-sp {
        margin: auto;
    }

    .mgn-auto-y-sp {
        margin-left: auto;
        margin-right: auto;
    }
}

/*
    inner
*/
.inner {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

.inner500,
.inner600,
.inner700,
.inner800,
.inner900,
.inner1000,
.inner1100,
.inner1200,
.inner1300,
.inner1400,
.inner1500 {
    max-width: 500px;
    padding: 0;
    margin-left: auto;
    margin-right: auto;
}

.inner600 {
    max-width: 600px;
}

.inner700 {
    max-width: 700px;
}

.inner800 {
    max-width: 800px;
}

.inner900 {
    max-width: 900px;
}

.inner1000 {
    max-width: 1000px;
}

.inner1100 {
    max-width: 1100px;
}

.inner1200 {
    max-width: 1200px;
}

.inner1300 {
    max-width: 1300px;
}

.inner1400 {
    max-width: 1400px;
}

.inner1500 {
    max-width: 1500px;
}

.width500 {
    max-width: 100%;
    width: 500px;
}

.width550 {
    max-width: 100%;
    width: 550px;
}

.width600 {
    max-width: 100%;
    width: 600px;
}

.width650 {
    max-width: 100%;
    width: 650px;
}

.width700 {
    max-width: 100%;
    width: 700px;
}

.width750 {
    max-width: 100%;
    width: 750px;
}

.width800 {
    max-width: 100%;
    width: 800px;
}

.width850 {
    max-width: 100%;
    width: 850px;
}

.width900 {
    max-width: 100%;
    width: 900px;
}

.width950 {
    max-width: 100%;
    width: 950px;
}

.width1000 {
    max-width: 100%;
    width: 1000px;
}

@media (min-width: 768px) and (max-width: 1280px) {
    .inner {
        width: 92%;
    }

    .width500 {
        width: min(calc(500 / 1200 * 100vw), 500px);
    }

    .width550 {
        width: min(calc(550 / 1200 * 100vw), 550px);
    }

    .width600 {
        width: min(calc(600 / 1200 * 100vw), 600px);
    }

    .width650 {
        width: min(calc(650 / 1200 * 100vw), 650px);
    }

    .width700 {
        width: min(calc(700 / 1200 * 100vw), 700px);
    }

    .width750 {
        width: min(calc(750 / 1200 * 100vw), 750px);
    }

    .width800 {
        width: min(calc(800 / 1200 * 100vw), 800px);
    }

    .width850 {
        width: min(calc(850 / 1200 * 100vw), 850px);
    }

    .width900 {
        width: min(calc(900 / 1200 * 100vw), 900px);
    }

    .width950 {
        width: min(calc(950 / 1200 * 100vw), 950px);
    }

    .width100 {
        width: min(calc(1000 / 1200 * 100vw), 1000px);
    }
}

@media(max-width: 767px) {
    .inner {
        width: 100%;
        padding: 0 3.5vw;
    }

    .inner-lift {
        padding: 0 !important;
    }
}


/* 
    gnav
*/
#gnav-toggle {
    display: block;
    width: 90px;
    height: 90px;
    border: none;
    outline: none;
    color: #fff;
    background: var(--color);
    position: fixed;
    top: 15px;
    right: 15px;
    z-index: 10000;
}

.gnav_hamburger .gnav_text {
    width: 100%;
    font-size: 15px;
    text-align: center;
    letter-spacing: 0;
    color: #fff;
    position: absolute;
    bottom: 12.5px;
    left: 0;
    right: 0;
}

.gnav_hamburger .gnav_icon {
    width: 40px;
    height: 3px;
    position: absolute;
    top: -25px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    background: #fff;
    transition: transform .3s ease-in-out;
}

.gnav_hamburger .gnav_icon:before,
.gnav_hamburger .gnav_icon:after {
    content: "";
    width: 100%;
    height: 3px;
    position: absolute;
    left: 0;
    right: 0;
    background: #fff;
    transition: transform .3s ease-in-out;
}

.gnav_hamburger .gnav_icon:before {
    top: -12.5px;
}

.gnav_hamburger .gnav_icon::after {
    bottom: -12.5px;
}

.is_active .gnav_icon {
    background: none;
}

.is_active .gnav_icon:before,
.is_active .gnav_icon:after {
    transition: transform .3s ease-in-out;
}

.is_active .gnav_icon:before {
    transform: rotate(45deg);
    top: 0 !important;
}

.is_active .gnav_icon:after {
    transform: rotate(-45deg);
    bottom: 0 !important;
}

.gnav {
    width: 100%;
    height: 100%;
    line-height: 1.45;
    font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
    color: #333;
    background: rgba(255, 255, 255, 1);
    position: fixed;
    top: 0;
    right: 0;
    z-index: 9999;
    visibility: hidden;
    opacity: 0;
    transition: opacity .6s ease, visibility .6s ease;
    padding: var(--size150px) 0 var(--size200px);
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.gnav .wrap {
    max-width: 700px;
    width: 92%;
    margin: auto;
}

.gnav .logo {
    width: var(--size370px);
    margin: 0 auto var(--size15px);
}

.gnav_open .gnav {
    visibility: visible;
    opacity: 1;
}

.gnav .menu-gnav-container {
    padding-bottom: 200px;
}

.menu-gnav-container>ul {
    display: block;
    padding: 0 30px;
}

.menu-gnav-container>ul>li {
    opacity: 0;
    border-bottom: 1px solid var(--color5);
    transform: translateX(50%);
    transition: transform .6s ease, opacity .2s ease;
}

.gnav_open .sitemap>li {
    opacity: 1;
    transform: translateX(0);
    transition: transform 1s ease, opacity .9s ease;
}

.gnav_open .sitemap>li>a {
    display: block;
    width: 100%;
    padding: var(--size15px);
    padding-left: var(--size40px);
    font-size: 110%;
    text-align: left;
    position: relative;
}

.gnav_open .sitemap>li>a:after {
    content: "";
    width: 0;
    height: 0;
    margin: auto;
    border-left: 10px solid var(--color);
    border-bottom: 8px solid transparent;
    border-top: 8px solid transparent;
    position: absolute;
    left: 0;
    top: 0;
    bottom: .25em;
}

@media(min-width: 768px) and (max-width:1280px) {
    #gnav-toggle {
        width: 80px;
        height: 80px;
    }

    .gnav_hamburger .gnav_text {
        font-size: 14px;
        bottom: 7.5px;
    }

    .gnav_hamburger .gnav_icon {
        width: 36px;
    }

    .gnav_hamburger .gnav_icon:before {
        top: -11px;
    }

    .gnav_hamburger .gnav_icon::after {
        bottom: -11px;
    }
}

@media(min-width: 768px) and (max-width:1024px) {
    #gnav-toggle {
        width: 70px;
        height: 70px;
        top: 10px;
        right: 10px;
    }

    .gnav_hamburger .gnav_text {
        font-size: 12px;
        bottom: 7.5px;
    }

    .gnav_hamburger .gnav_icon {
        width: 30px;
    }

    .gnav_hamburger .gnav_icon:before {
        top: -10px;
    }

    .gnav_hamburger .gnav_icon::after {
        bottom: -10px;
    }
}

@media(max-width: 767px) {
    #gnav-toggle {
        width: calc(100 / 750 * 100vw);
        height: calc(100 / 750 * 100vw);
        position: fixed;
        top: 2.8vw;
        right: 2.8vw;
    }

    .gnav_hamburger .gnav_text {
        font-size: calc(20 / 750 * 100vw);
        bottom: .5vw;
    }

    .gnav_hamburger .gnav_icon {
        width: calc(40 / 750 * 100vw);
        height: 1.8px;
        top: -3.5vw;
    }

    .gnav_hamburger .gnav_icon:before,
    .gnav_hamburger .gnav_icon:after {
        height: 1.8px;
    }

    .gnav_hamburger .gnav_icon:before {
        top: -1.5vw;
    }

    .gnav_hamburger .gnav_icon:after {
        bottom: -1.5vw;
    }

    .gnav {
        padding: 25vw 0 50vw;
    }

    .gnav .menu-gnav-container {
        padding-bottom: 20vw;
    }

    .menu-gnav-container>ul {
        padding: 0 3vw;
    }

    .menu-gnav-container>ul>li:first-child {
        border-top: 1px solid var(--color5);
    }

    .menu-gnav-container>ul>li>a {
        font-size: 100%;
        padding: 3vw 4vw 3vw 5vw;
    }

    .menu-gnav-container>ul>li>a:after {
        bottom: .5vw;
        border-left-width: calc(16 / 750 * 100vw);
        border-top: calc(12 / 750 * 100vw) solid transparent;
        border-bottom: calc(12 / 750 * 100vw) solid transparent;
    }
}


@media (min-width: 768px) {
    /* #gnav-toggle {
width: calc(100 / 1280 * 100vw);
height: calc(100 / 1280 * 100vw);
background: var(--color5);
border: none;
position: absolute;
top: 15px;
right: 15px;
z-index: 10000;
outline: none;
}
.gnav .menu-item>a {
padding: 10px 0;
}

.gnav .menu-item>a::before {
content: "";
width: 0;
transition: .3s all;
}

.gnav .menu-item>a:hover::before,
.gnav .current-menu-item>a::before,
.single-works .menu-item-object-works>a::before,
.single-news .is-top .menu-item-object-news>a::before {
content: "";
width: 90%;
height: 1px;
margin: auto;
background: #333;
position: absolute;
left: 0;
right: 0;
bottom: -2.5px;
transition: .3s all;
}

.is-top .menu-item>a:hover::before,
.is-top .current-menu-item>a::before,
.single-works .is-top .menu-item-object-works>a::before,
.single-news .is-top .menu-item-object-news>a::before {
background: #fff;
}

.btn_contact_common01 {
width: 170px;
height: 60px;
padding-top: 5px;

} */
}

/* 
    btn-common
*/
.btn-common {
    max-width: 100%;
    max-height: 80px;
    width: 380px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.5;
    text-align: center;
    color: var(--buttonColor1);
    background: #fff;
    border: 2px solid var(--buttonColor1);
    position: relative;
    z-index: 1;
}

.btn-common.mini {
    max-height: 44px;
    width: 180px;
    height: 44px;
    line-height: .9;
}

.btn-common.reversal {
    color: #fff;
    background: var(--buttonColor1);
}

.btn-common::before {
    content: "";
    width: 0;
    height: 0;
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 5%;
}

@media (min-width: 1025px) {
    .btn-common:hover {
        color: #fff;
        background: var(--buttonColor1);
        transition: all .5s;
    }
}

@media(min-width: 768px) and (max-width: 1024px) {
    .btn-common {
        width: calc(380 / 1000 * 100vw);
        height: calc(80 / 1000 * 100vw);
    }

    .btn-common.mini {
        width: calc(180 / 1000 * 100vw);
        height: calc(40 / 1000 * 100vw);
    }

}

@media (max-width: 767px) {
    .btn-common {
        max-width: 100%;
        width: calc(480 / 750 * 100vw);
        height: calc(100 / 750 * 100vw);
    }

    .btn-common.mini {
        width: calc(360 / 750 * 100vw);
        height: calc(80 / 750 * 100vw);
        padding-top: .5vw;
        padding-right: 2vw;
        font-size: 100%;
    }
}

/* 
.boxCommon01
*/
.boxCommon01 {
    padding: var(--size50px) var(--size40px);
    border: 1px solid #333;
    position: relative;
    z-index: 1;
}

@media (max-width: 767px) {
    .boxCommon01 {
        padding: var(--size40px);
    }
}

/* 
list_news
*/
.list_news.scroll {
    max-height: 300px;
    height: auto;
    padding-right: 25px;
    position: relative;
    scrollbar-color: var(--scrollColor) #fff;
    scrollbar-width: thin;
    overflow-y: scroll;
}

.list_news.scroll::-webkit-scrollbar-thumb {
    background-color: var(--scrollColor);
}

.list_news.scroll::-webkit-scrollbar-track {
    background-color: #fff;
}

.list_news.scroll::-webkit-scrollbar {
    width: 8px;
}

.list_news li {
    border-top: 1px solid #ccc;
}

.list_news li:last-child {
    border-bottom: 1px solid #ccc;
}

.list_news li a {
    width: 100%;
    padding: 25px 20px;
}

.list_news time {
    padding-right: 1em;
    font-size: 95%;
    color: #ccc;
}

.list_news .btn_news {
    width: 150px;
    height: 32px;
    border: 1px solid #ccc;
    line-height: 32px;
    font-size: 95%;
    border-radius: 4px;
}

@media (min-width: 768px) {
    .list_news .txt_news {
        width: calc(100% - 310px);
        padding-left: 1em;
        transition: all .8s;
    }
}

@media (min-width: 1025px) {
    .list_news a:hover time {
        color: var(--color1);
        transition: all .6s;
    }

    .list_news a:hover .txt_news {
        color: var(--color1);
        transition: all .6s;
    }

    .list_news a:hover .btn_news {
        color: var(--color1);
        border-color: var(--color1);
        transition: all .6s;
    }
}

@media (min-width: 768px) and (max-width:1280px) {
    .list_news.scroll {
        max-height: min(calc(300 / 1200 * 100vw), 300px);
        padding-right: min(calc(25 / 1200 * 100vw), 25px);
    }

    .list_news.scroll::-webkit-scrollbar {
        width: 5px;
    }

    .list_news li a {
        padding: calc(25 / 1280 * 100vw) calc(20 / 1280 * 100vw);
    }

    .list_news .txt_news {
        width: calc(100% - 310 / 1200 * 100vw);
    }

    .list_news .btn_news {
        width: min(calc(150 / 1200 * 100vw), 150px);
        height: min(calc(32 / 1200 * 100vw), 32px);
        line-height: min(calc(32 / 1200 * 100vw), 32px);
        border-radius: min(calc(4 / 1200 * 100vw), 4px);
    }
}

@media (min-width: 768px) and (max-width: 1024px) {}

@media (max-width: 767px) {
    .list_news.scroll {
        padding-right: 3vw;
        line-height: 1.75;
    }

    .list_news.scroll::-webkit-scrollbar {
        width: 5px;
    }

    .list_news li a {
        width: 100%;
        padding: 2.5vw 1vw;
        font-size: 95%;
    }

    .list_news .txt_news {
        width: 100%;
    }

    .list_news time {
        padding-right: .75em;
        letter-spacing: 0;
        font-size: 90%;
    }

    .list_news .btn_news {
        width: calc(200 / 750 * 100vw);
        height: calc(40 / 750 * 100vw);
        line-height: calc(40 / 750 * 100vw);
        font-size: 85%;
        border-radius: 4px;
        z-index: 8;
    }
}

/* 
    .pagetop
*/
.pagetop {
    display: block;
    width: 15px;
    position: fixed;
    right: 30px;
    bottom: 30px;
    z-index: 1000;
    opacity: 0;
    transition: .5s all;
}

@media (max-width: 767px) {
    .pagetop {
        width: calc(20 / 750 * 100vw);
        bottom: calc(150 / 750 * 100vw);
        right: 4vw;
    }
}

/* 
    ttl-common01
*/
.ttl-common {
    position: relative;
    z-index: 1;
}

.ttl-common::before {
    content: "";
    margin: auto;
    position: absolute;
    z-index: 1;
}

.ttl-common.ttl01 {
    text-align: left;
    line-height: 1.55;
    padding: .6em 1em .5em;
    background: rgba(0, 0, 0, .1);
}

.ttl-common.ttl01::before {
    width: 10px;
    height: 100%;
    margin: auto;
    background: var(--color5);
    left: 0;
    top: 0;
    bottom: 0;
}

.ttl-common.ttl04 {
    padding-bottom: 15px;
}

.ttl-common.ttl04::before {
    max-width: 80px;
    width: 80px;
    height: 4px;
    background: #333;
    left: 0;
    bottom: 0;
}

.ttl-common.ttl04.text-center::before {
    right: 0;
}

.ttl-common.ttl02::before {
    width: 100%;
    height: 1px;
    background: #333;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.ttl-common.ttl02 .bg {
    background: #fff;
    padding: .2em 1em .2em 0;
    position: relative;
    z-index: 1;
}

.ttl-common.ttl02.text-center .bg {
    padding: .2em 1em;
}

.ttl-common.ttl03 {
    padding-bottom: var(--size15px);
    text-align: center;
}

.ttl-common.ttl03::before {
    width: var(--size40px);
    height: 1px;
    background: var(--color2);
    bottom: 0;
    left: 0;
    right: 0;
}

.ttl-common.ttlnum {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ttl-common.ttlnum .num {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 40px;
    height: 40px;
    color: #fff;
    background: var(--color5);
}

.ttl-common.ttlnum .txt {
    width: calc(100% - 60px);
}

.ttl-common.turn-up {
    line-height: 1;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}

.ttl-common.turn-up .bg {
    padding: .2em 1.25em;
    background: #fff;
    position: relative;
    z-index: 1;
}

@media (min-width: 768px) and (max-width: 1024px) {}

@media (max-width: 767px) {
    .ttl-common.ttl01::before {
        width: 5px;
    }

    .ttl-common.ttl04 {
        padding-bottom: 2.5vw;
    }

    .ttl-common.ttl04::before {
        width: calc(80 / 750 * 100vw);
        height: 2px;
    }

    .ttl-common.ttl03 {
        padding-bottom: calc(20 / 750 * 100vw);
    }

    .ttl-common.ttl03::before {
        width: calc(50 / 750 * 100vw);
    }

    .ttl-common.turn-up .bg {
        padding: .2em .75em;
        letter-spacing: 0;
    }
}

/* 
    ttl-common02
*/
.ttl-common02 {
    padding: var(--size15px);
    line-height: 1.6;
}

.ttl-common02.bg,
.ttl-common02.bg02 {
    text-align: center;
    color: #fff;
    background: #4F6178;
}

.ttl-common02.bg02 {
    padding: var(--size15px);
}

.ttl-common02.bdr {
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
}

.ttl-common02.bdr02 {
    padding-top: 0;
    border-bottom: 1px solid #333;
}

@media (min-width: 768px) and (max-width: 1024px) {}

@media (max-width: 767px) {
    .ttl-common02.bg02 {
        padding: 2vw;
    }
}

/* 
   tag-name
*/
.tag-name .tag-names-pr {
    padding-right: 1em;
}

.tag-name .text-name {
    font-size: 200%;
}

/* 
    tbl-common01
*/
.tbl-common01 {
    margin: 0 auto var(--size60px);
}

.tbl-common01 table {
    width: 100%;
    line-height: 1.75;
    border: 1px solid rgba(255, 131, 119, 1);
}

.tbl-common01 th {
    width: 50%;
    color: #fff;
    background: rgba(255, 131, 119, 1);
    text-align: left;
    font-weight: normal;
    padding: var(--size20px);
    vertical-align: top;
}

.tbl-common01 td {
    width: 50%;
    padding: var(--size20px);
}

.tbl-common01.reverse th {
    width: 65%;
}

.tbl-common01.reverse td {
    width: 35%;
}

.tbl-common01 tr:not(:last-child) th {
    border-bottom: 1px solid #fff;
}

.tbl-common01 tr:not(:last-child) td {
    border-bottom: 1px solid #333 !important;
}

.tbl-common01 .last {
    border-bottom: 0 !important;
}

.tbl-common01 .group {
    margin-bottom: 40px;
    position: relative;
    z-index: 1;
}

.tbl-common01 .group:last-child {
    margin-bottom: 0
}

.tbl-common01 .bnt-goolgemap {
    margin-top: 15px
}

.tbl-common01.tbl-white th {
    background: #fff !important;
    color: #333 !important;
}

.tbl-common01.tbl-white th {
    border-right: 1px solid #333;
}

.tbl-common01.tbl-white tr:not(:last-child) th {
    border-color: #333 !important;
}


.tbl-common01.style table {
    border-left: 0;
    border-right: 0;
    border-top: 4px solid #333;
}

.tbl-common01.style thead th {
    text-align: center;
    color: #333;
    background: #eee;
}

.tbl-common01.style tbody th {
    vertical-align: middle;
    text-align: center;
    color: #333;
    background: #fff;
}

.tbl-common01.style .t01 {
    width: 27.5%;
    border-right: 1px dotted #333;
}

.tbl-common01.style :not(:last-child) .t01 {
    border-bottom-color: #333;
}

.tbl-common01.style .t02 {
    width: 72.5%;
}

@media (max-width: 767px) {

    .tbl-common01.cell100-sp table,
    .tbl-common01.cell100-sp thead,
    .tbl-common01.cell100-sp tbody,
    .tbl-common01.cell100-sp tr,
    .tbl-common01.cell100-sp th,
    .tbl-common01.cell100-sp td {
        display: block;
        width: 100%;
    }

    .tbl-common01.cell100-sp th {
        border-right-width: 0;
    }

    .tbl-common01.cell100-sp th {
        border-bottom: 1px solid #333;
    }
}

/* tbl-form-common01 */
.tbl-form-common01 table {
    width: 100%;
    margin: 0 auto var(--size60px);
    border-top: 1px solid #ccc
}

.tbl-form-common01 tr {
    border-bottom: 1px solid #ccc
}

.tbl-form-common01 th {
    width: 40%;
    font-weight: normal;
    padding: var(--size40px) 5% var(--size40px) 0;
    text-align: left;
    font-weight: normal;
    vertical-align: middle;
    position: relative;
    z-index: 1;
}

.tbl-form-common01 td {
    width: 60%;
    padding: var(--size40px) 0 var(--size40px);
    vertical-align: middle;
}

.tbl-form-common01 .cover-required {
    display: block;
    width: 100%;
    padding-right: var(--size70px);
    position: relative;
    z-index: 1;
}

.tbl-form-common01 .is-required {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 55px;
    height: 30px;
    line-height: 30px;
    margin: auto;
    font-size: 85%;
    color: #fff;
    background: var(--color3);
    position: absolute;
    top: 0;
    bottom: 0;
    right: 1em;
    margin: auto;
}

.tbl-form-common01 input[type="text"],
.tbl-form-common01 input[type="email"],
.tbl-form-common01 input[type="tel"] {
    width: 100%;
    padding: 5px 15px;
    border: 1px solid #ddd;
    border-radius: 0;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    resize: vertical;
}

.tbl-form-common01 textarea {
    display: block;
    width: 100%;
    padding: 5px 15px;
    border: none;
    box-shadow: 0 0 0 1px #ccc inset;
    border-radius: 0;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    resize: vertical;
}

.tbl-form-common01 span.wpcf7-list-item {
    margin-left: 0 !important;
    margin-right: 1em !important;
}

.tbl-form-common01 .w10 input {
    width: 10%;
}

.tbl-form-common01 .w20 input {
    width: 20%;
}

.tbl-form-common01 .w40 input {
    width: 40%;
}

.tbl-form-common01 .w50 input {
    width: 50%;
}

.tbl-form-common01 .w60 input {
    width: 60%;
}

.tbl-form-common01 .w80 input {
    width: 80%;
}

.tbl-form-common01.tbl-color1 table {
    border-color: var(--color1);
}

.tbl-form-common01.tbl-color1 tr {
    border-color: var(--color1);
}

.tbl-form-common01.tbl-color2 table {
    border-color: var(--color2);
}

.tbl-form-common01.tbl-color2 tr {
    border-color: var(--color2);
}

.tbl-form-common01.tbl-color3 table {
    border-color: var(--color3);
}

.tbl-form-common01.tbl-color3 tr {
    border-color: var(--color3);
}

.tbl-form-common01.tbl-color4 table {
    border-color: var(--color4);
}

.tbl-form-common01.tbl-color4 tr {
    border-color: var(--color4);
}

.tbl-form-common01.tbl-color5 table {
    border-color: var(--color5);
}

.tbl-form-common01.tbl-color5 tr {
    border-color: var(--color5);
}

.tbl-form-common01 .wpcf7-list-item-label {
    padding-left: .25em;
}

.txt-form-accept {
    text-align: center;
    margin-bottom: var(--size50px);
}

.txt-form-accept input {
    transform: scale(1.5);
}

.txt-form-accept a {
    text-decoration: underline;
}

.txt-form-accept .wpcf7-list-item-label {
    padding-left: 1em;
}

.btn-submit-common {
    max-width: 350px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 1;
}

.btn-submit-common:hover {
    cursor: pointer;
    opacity: .85;
    transition: .3s;
}

.btn-submit-common input:hover {
    cursor: pointer;
}

.btn-submit-common .wpcf7-spinner {
    position: absolute;
    top: 0;
    bottom: 0;
    right: -5%;
    margin: auto !important;
}

.btn-submit-common:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    top: 0;
    bottom: 0;
    margin: auto;
    right: var(--size40px);
    transform: rotate(-45deg);
}

.btn-submit-common input {
    width: 100%;
    height: 70px;
    line-height: 1;
    text-align: center;
    color: #fff;
    background: #333;
}

.btn-submit-common input:disabled {
    background: #ddd;
    cursor: not-allowed;
}

.tbl-form-common01 .w10 input {
    width: 12.5%;
}

.tbl-form-common01 .w20 input {
    width: 25%;
}

.tbl-form-common01 .w40 input {
    width: 45%;
}

.tbl-form-common01 .w50 input {
    width: 55%;
}

.tbl-form-common01 .w60 input {
    width: 65%;
}

.tbl-form-common01 .w80 input {
    width: 85%;
}

.tbl-form-common01 .w100 input {
    width: 100%;
}

@media (max-width: 1280px) {
    .btn-submit-common {
        max-width: 320px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .btn-submit-common {
        width: calc(320 / 1000 * 100vw);
    }

    .tbl-form-common01 .w10 input {
        width: 15%;
    }

    .tbl-form-common01 .w20 input {
        width: 40%;
    }

    .tbl-form-common01 .w40 input {
        width: 60%;
    }

    .tbl-form-common01 .w50 input {
        width: 75%;
    }

    .tbl-form-common01 .w60 input {
        width: 80%;
    }

    .tbl-form-common01 .w80 input {
        width: 100%;
    }
}

@media (max-width: 767px) {

    .tbl-form-common01 table,
    .tbl-form-common01 thead,
    .tbl-form-common01 tbody,
    .tbl-form-common01 tr,
    .tbl-form-common01 th,
    .tbl-form-common01 td {
        display: block;
        width: 100% !important;
    }

    .tbl-form-common01 .w10 input {
        width: 20% !important;
    }

    .tbl-form-common01 .w20 input {
        width: 50% !important;
    }

    .tbl-form-common01 .w40 input {
        width: 70% !important;
    }

    .tbl-form-common01 .w50 input {
        width: 80% !important;
    }

    .tbl-form-common01 .w60 input {
        width: 100% !important;
    }

    .tbl-form-common01 .w80 input {
        width: 100% !important;
    }

    .btn-submit-common {
        max-width: calc(550 / 750 * 100vw);
    }

    .btn-submit-common input {
        height: calc(100 / 750 * 100vw);
    }

    .tbl-form-common01 th {
        padding: 4vw 0 2.5vw;
    }

    .tbl-form-common01 td {
        padding: 3vw 0 5vw;
    }

    .tbl-form-common01 .is-required {
        position: absolute;
        top: 2vw;
        right: 0;
    }
}


/* 
     bnt-goolgemap
*/
.bnt-goolgemap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 200px;
    height: 40px;
    font-size: 90%;
    line-height: 1.5;
    text-align: center;
    border: 1px solid #333;
    position: relative;
    z-index: 1;
}

.bnt-goolgemap::before {
    content: "";
    width: 15px;
    height: 20px;
    margin: auto;
    background: url(../images/commons/icon-address01.svg)no-repeat center / contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 7.5%;
}

.bnt-goolgemap::after {
    content: "";
    width: 0;
    height: 0;
    margin: auto;
    border-left: 10px solid #333;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 7.5%;
}

@media (max-width: 767px) {
    .bnt-goolgemap {
        width: calc(350 / 750 * 100vw);
        height: calc(80 / 750 * 100vw);
    }

    .bnt-goolgemap::after {
        border-left-width: 10px;
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent;
    }
}


/* 
    cover-common01
*/
.cover-common01 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-start;
}

.cover-common01.items-stretch {
    align-items: stretch;
}

.cover-common01.items-center {
    align-items: center;
}

.cover-common01.justify-center {
    justify-content: center;
}

.cover-common01.justify-start {
    justify-content: flex-start;
}

.cover-common01>.col18 {
    width: 18%;
}

.cover-common01>.col20 {
    width: 20%;
}

.cover-common01>.col22 {
    width: 22%;
}

.cover-common01>.col24 {
    width: 24%;
}

.cover-common01>.col26 {
    width: 26%;
}

.cover-common01>.col28 {
    width: 28%;
}

.cover-common01>.col30 {
    width: 30%;
}

.cover-common01>.col32 {
    width: 32%;
}

.cover-common01>.col34 {
    width: 34%;
}

.cover-common01>.col36 {
    width: 36%;
}

.cover-common01>.col38 {
    width: 38%;
}

.cover-common01>.col40 {
    width: 40%;
}

.cover-common01>.col42 {
    width: 42%;
}

.cover-common01>.col44 {
    width: 44%;
}

.cover-common01>.col46 {
    width: 46%;
}

.cover-common01>.col48 {
    width: 48%;
}

.cover-common01>.col50 {
    width: 50%;
}

.cover-common01>.col52 {
    width: 52%;
}

.cover-common01>.col54 {
    width: 54%;
}

.cover-common01>.col56 {
    width: 56%;
}

.cover-common01>.col58 {
    width: 58%;
}

.cover-common01>.col60 {
    width: 60%;
}

.cover-common01>.col62 {
    width: 62%;
}

.cover-common01>.col64 {
    width: 64%;
}

.cover-common01>.col66 {
    width: 66%;
}

.cover-common01>.col68 {
    width: 68%;
}

.cover-common01>.col70 {
    width: 70%;
}

.cover-common01>.col72 {
    width: 72%;
}

.cover-common01>.col74 {
    width: 74%;
}

.cover-common01>.col76 {
    width: 76%;
}

.cover-common01>.col78 {
    width: 78%;
}

.cover-common01>.col80 {
    width: 80%;
}

.cover-common01.x2>.col:not(:first-child) {
    margin-top: 40px;
}

.cover-common01.x3>.col:nth-of-type(n + 3) {
    margin-top: 40px;
}

@media (min-width: 768px) and (max-width: 1024px) {
    .cover-common01 .box-common {
        padding: var(--size30px);
    }
}

@media (max-width: 767px) {
    .cover-common01>.order {
        order: 0;
    }

    .cover-common01>.order1 {
        order: 1;
        margin-top: 7.5vw;
    }

    .cover-common01>.order2 {
        order: 2;
        margin-top: 7.5vw;
    }

    .cover-common01.x1-sp>.col {
        margin: 7.5vw auto 0;
    }

    .cover-common01.x1-sp>.col:first-child {
        margin-top: 0;
    }

    .cover-common01.x2-sp>.col:nth-of-type(n + 3) {
        margin-top: 5vw
    }

    .cover-common01.x3-sp>.col:nth-of-type(n + 4) {
        margin-top: 5vw;
    }

    .cover-common01 picture {
        display: block;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .cover-common01>*[class*="col"] {
        width: 100%;
    }

    .cover-common01>.col100-sp {
        width: 100%;
    }

    .cover-common01>.col90-sp {
        width: 90%;
    }

    .cover-common01>.col80-sp {
        width: 80%;
    }

    .cover-common01>.col70-sp {
        width: 70%;
    }

    .cover-common01>.col68-sp {
        width: 68%;
    }

    .cover-common01>.col66-sp {
        width: 66%;
    }

    .cover-common01>.col64-sp {
        width: 64%;
    }

    .cover-common01>.col62-sp {
        width: 62%;
    }

    .cover-common01>.col60-sp {
        width: 60%;
    }

    .cover-common01>.col58-sp {
        width: 58%;
    }

    .cover-common01>.col56-sp {
        width: 56%;
    }

    .cover-common01>.col54-sp {
        width: 54%;
    }

    .cover-common01>.col52-sp {
        width: 52%;
    }

    .cover-common01>.col50-sp {
        width: 50%;
    }

    .cover-common01>.col48-sp {
        width: 48%;
    }

    .cover-common01>.col46-sp {
        width: 46%;
    }

    .cover-common01>.col44-sp {
        width: 44%;
    }

    .cover-common01>.col42-sp {
        width: 42%;
    }

    .cover-common01>.col40-sp {
        width: 40%;
    }

    .cover-common01>.col38-sp {
        width: 38%;
    }

    .cover-common01>.col36-sp {
        width: 36%;
    }

    .cover-common01>.col32-sp {
        width: 32%;
    }

    .cover-common01>.col30-sp {
        width: 30%;
    }
}

/* 
  btn-blank
*/
.btn-blank {
    padding-right: 25px;
    text-decoration: underline;
    position: relative;
    z-index: 1;
}

.btn-blank::before {
    content: "";
    width: 15px;
    height: 15px;
    margin: auto;
    background: url(../images/commons/icon-blank.svg)no-repeat center / contain;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
}

/* 
    .area-accordion-common
*/
.area-accordion-common>.cover-accordion {
    margin-bottom: var(--size50px);
    border: 1px solid var(--color3);
    position: relative;
    z-index: 1;
}

.area-accordion-common .accordion-label {
    display: block;
    width: 100%;
    padding: var(--size15px) 3% var(--size15px) var(--size70px);
    font-size: 115%;
    line-height: 1.6;
    color: #fff;
    background: var(--color3);
    position: relative;
    z-index: 1;
}

.area-accordion-common .accordion-toggle {
    display: none;
}

.area-accordion-common .accordion-label::before {
    content: "Q";
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--size40px);
    height: var(--size40px);
    font-size: 100%;
    margin: auto;
    text-align: center;
    color: var(--color1);
    background: #fff;
    position: absolute;
    top: 0;
    left: 0;
}

.area-accordion-common .accordion-label .icon::before,
.area-accordion-common .accordion-label .icon::after {
    content: "";
    width: var(--size20px);
    height: 2px;
    background: #fff;
    margin: auto;
    position: absolute;
    right: 3.5%;
    top: 0;
    bottom: 0;
    transition: .3s;
}

.area-accordion-common .accordion-label .icon::after {
    transform: rotate(90deg);
}

.area-accordion-common .accordion-content {
    height: 0;
    padding: 0 4%;
    overflow: hidden;
    transition: all .5s;
}

.accordion-toggle:checked+.accordion-label+.accordion-content {
    padding: 4%;
    height: auto;
    transition: all .5s;
}

.accordion-toggle:checked+.accordion-label .icon::after {
    transform: rotate(0deg);
    transition: .3s;
}

@media (max-width: 767px) {
    .area-accordion-common>.cover-accordion {
        margin-bottom: 5.5vw;

    }

    .area-accordion-common .accordion-label {
        padding: 2.25vw 3vw 2.25vw 10vw;
    }

    .area-accordion-common .accordion-label::before {
        width: calc(55 / 750 * 100vw);
        height: calc(55 / 750 * 100vw);
        font-size: 90%;
    }

    .area-accordion-common .accordion-label .icon::before,
    .area-accordion-common .accordion-label .icon::after {
        width: calc(30 / 750 * 100vw);
        height: calc(3 / 750 * 100vw);
    }

    .area-accordion-common .accordion-content {
        padding: 0 5vw;
    }

    .accordion-toggle:checked+.accordion-label+.accordion-content {
        padding: 5vw;
    }
}

/* 
    box-common
 */
.box-common {
    padding: var(--size50px);
}

.box-common.box-m {
    padding: var(--size40px);
}

.box-common.box-m02 {
    padding: var(--size30px);
}

.box-common.pt-x {
    padding-top: var(--size60px);
}

.box-common.pt-x2 {
    padding-top: var(--size70px);
}

.box-common.pt-x3 {
    padding-top: var(--size80px);
}

.box-common.box1 {
    position: relative;
    z-index: 1;
}

.box-common.box1::before,
.box-common.box1::after {
    content: "";
    height: 100%;
    margin: auto;
    border-style: solid;
    border-color: #fff;
    position: absolute;
    z-index: -1;
}

.box-common.box1::before {
    width: 90%;
    border-top-width: var(--size10px);
    border-left-width: var(--size10px);
    top: 0;
    left: 0;
}

.box-common.box1::after {
    width: 90%;
    border-bottom-width: var(--size10px);
    border-right-width: var(--size10px);
    bottom: 0;
    right: 0;
}

.box-shadow01 {
    box-shadow: 0 0 10px 0 rgb(51 51 51 / 10%);
}

.box-common.boxflow {
    border: 2px solid var(--color5);
    margin-bottom: var(--size60px);
    position: relative;
    z-index: 1;
}

.box-common.boxflow::before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    margin: auto;
    border-top: var(--size15px) solid var(--color5);
    border-right: var(--size20px) solid transparent;
    border-left: var(--size20px) solid transparent;
    right: 0;
    left: 0;
    bottom: -40px;
}

.box-common.boxflow:last-child::before {
    content: none;
}

.box-common.boxflow:last-child {
    margin-bottom: 0;
}

.box-common .box-common {
    padding: 3% 4%;
}

@media (min-width: 768px) {
    .cover-common01 .box-common {
        padding: var(--size30px);
    }
}

@media (min-width: 768px) and (max-width: 1280px) {
    .box-common.boxflow::before {
        bottom: calc(-40/ 1280 * 100vw);
    }
}

@media (max-width: 767px) {
    .box-common {
        padding: 5vw;
    }

    .box-common.box1::before {
        border-top-width: 4px;
        border-left-width: 4px;
    }

    .box-common.box1::after {
        border-bottom-width: 4px;
        border-right-width: 4px;
    }

    .box-common.boxflow {
        margin-bottom: 7.5vw;
    }

    .box-common.boxflow::before {
        border-top-width: 10px;
        border-right: 15px solid transparent;
        border-left: 15px solid transparent;
        bottom: -5vw;
    }

    .box-common.boxflow:last-child::before {
        content: none;
    }

    .box-common.boxflow:last-child {
        margin-bottom: 0;
    }
}


/* 
 * list-common 
 */
.list-common li {
    line-height: 1.5;
    position: relative;
    z-index: 1;
}

.list-common li::before {
    content: "";
    margin: auto;
    position: absolute;
    z-index: 1;
}

.list-common.x2 li {
    width: 48%;
}

.list-common.x3 li {
    width: 32%;
}

.list-common.x1 li {
    margin-bottom: 15px;
}

.list-common.x1 li:last-child {
    margin-bottom: 0;
}

.list-common.x2 li:nth-of-type(n + 3) {
    margin-top: 15px;
}

.list-common.x3 li:nth-of-type(n + 4) {
    margin-top: 15px;
}

.list-common.dot li {
    padding-left: 15px;
}

.list-common.dot li::before {
    width: 6px;
    height: 6px;
    background: var(--color2);
    border-radius: 100%;
    left: 0;
    top: .55em;
}

.list-common.dot01 li::before {
    background: var(--color1);
}

.list-common.check li {
    padding-left: var(--size30px);
}

.list-common.check li::before {
    width: var(--size20px);
    height: var(--size20px);
    margin: auto;
    left: 0;
    top: .4em;
    background: url(images/icn-check01.svg)no-repeat center / contain;
}

@media (max-width: 767px) {
    .list-common.x1 li {
        width: 100%;
    }

    .list-common.x2 li {
        width: 100%;
    }

    .list-common.x3 li {
        width: 48%;
    }

    .list-common.x1 li,
    .list-common.x2 li {
        margin-bottom: 2vw;
    }

    .list-common.x1 li:last-child,
    .list-common.x2 li:last-child {
        margin-bottom: 0;
    }

    .list-common.x3 li:nth-of-type(n + 3) {
        margin-top: 2vw;
    }

    .list-common.check li {
        padding-left: calc(35 / 750 * 100vw);
    }

    .list-common.check li::before {
        width: calc(25 / 750 * 100vw);
        height: calc(25 / 750 * 100vw);
    }
}

/* 
    ttl-common 
*/
.leading-none {
    line-height: 1 !important;
}

.leading-tight {
    line-height: 1.25 !important;
}

.leading-snug {
    line-height: 1.375 !important;
}

.leading-normal {
    line-height: 1.5 !important;
}

.leading-relaxed {
    line-height: 1.625 !important;
}

.leading-loose {
    line-height: 2 !important;
}

@media (min-width: 768px) {
    .md\:.leading-none {
        line-height: 1 !important;
    }

    .md\:.leading-tight {
        line-height: 1.25 !important;
    }

    .md\:.leading-snug {
        line-height: 1.375 !important;
    }

    .md\:.leading-normal {
        line-height: 1.5 !important;
    }

    .md\:.leading-relaxed {
        line-height: 1.625 !important;
    }

    .md\:.leading-loose {
        line-height: 2 !important;
    }
}

@media (min-width: 1024px) {
    .lg\:.leading-none {
        line-height: 1 !important;
    }

    .lg\:.leading-tight {
        line-height: 1.25 !important;
    }

    .lg\:.leading-snug {
        line-height: 1.375 !important;
    }

    .lg\:.leading-normal {
        line-height: 1.5 !important;
    }

    .lg\:.leading-relaxed {
        line-height: 1.625 !important;
    }

    .lg\:.leading-loose {
        line-height: 2 !important;
    }
}

@media (min-width: 1280px) {
    .xl\:.leading-none {
        line-height: 1 !important;
    }

    .xl\:.leading-tight {
        line-height: 1.25 !important;
    }

    .xl\:.leading-snug {
        line-height: 1.375 !important;
    }

    .xl\:.leading-normal {
        line-height: 1.5 !important;
    }

    .xl\:.leading-relaxed {
        line-height: 1.625 !important;
    }

    .xl\:.leading-loose {
        line-height: 2 !important;
    }
}

.txet-indent {
    text-indent: 1em;
}

.txet-indent-reverse {
    padding-left: 1em;
    text-indent: -1em;
}

@media (min-width: 768px) {
    .md\:text-common-vertical {
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    }

    .md\.txet-indent {
        text-indent: 1em;
    }

    .md\.txet-indent-reverse {
        padding-left: 1em;
        text-indent: -1em;
    }
}

@media (min-width: 1024px) {
    .lg\:text-common-vertical {
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    }

    .lg\.txet-indent {
        text-indent: 1em;
    }

    .lg\.txet-indent-reverse {
        padding-left: 1em;
        text-indent: -1em;
    }
}

@media (min-width: 1280px) {
    .xl\:text-common-vertical {
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    }

    .xl\.txet-indent {
        text-indent: 1em;
    }

    .xl\.txet-indent-reverse {
        padding-left: 1em;
        text-indent: -1em;
    }
}

.pagination .nav-links {
    display: flex;
    justify-content: center;
    text-align: center;
}

.pagination .nav-links .current,
.pagination .nav-links .page-numbers {
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    width: 45px;
    height: 40px;
    font-size: 90%;
    margin: 0 5px;
    color: var(--color1);
    background: #fff;
    border: 1px solid var(--color1);
    transition: all .3s;
}

.pagination .nav-links .current {
    color: #fff;
    background: var(--color1);
    border-color: #fff;
}

.pagination .nav-links a.page-numbers:hover {
    color: #fff;
    background: var(--color1);
    border-color: #fff;
    transition: all .3s;
}

.pagination .nav-links a.prev.page-numbers,
.pagination .nav-links a.next.page-numbers {
    width: auto;
    padding: 0 7.5px;
    color: var(--color1);
    background: #fff;
    border: 1px solid var(--color1);
    transition: all .3s;
}

.pagination .nav-links a.prev.page-numbers:hover,
.pagination .nav-links a.next.page-numbers:hover {
    color: #fff;
    background: var(--color1);
    border-color: #fff;
    transition: all .3s;
}


@media (max-width: 767px) {

    .pagination .nav-links .current,
    .pagination .nav-links .page-numbers {
        width: 30px;
        height: 30px;
        margin: 0 .5vw;
    }

    .pagination .nav-links a.prev.page-numbers,
    .pagination .nav-links a.next.page-numbers {
        padding: 0 1.25vw;
    }
}

.border-2 {
    border-width: 1.5px !important;
}

.border-3 {
    border-width: 2px !important;
}

.border-4 {
    border-width: 2.5px !important;
}

.border-5 {
    border-width: 3px !important;
}

.border-6 {
    border-width: 3.5px !important;
}

.border-7 {
    border-width: 4px !important;
}

.border-8 {
    border-width: 4.5px !important;
}

.border-9 {
    border-width: 5px !important;
}

.border-10 {
    border-width: 5.5px !important;
}

.border-11 {
    border-width: 6px !important;
}

.border-12 {
    border-width: 6.5px !important;
}

.border-13 {
    border-width: 7px !important;
}

.border-14 {
    border-width: 7.5px !important;
}

.border-15 {
    border-width: 8px !important;
}

@media (min-width: 640px) {
    .border-2 {
        border-width: 2px !important;
    }

    .border-3 {
        border-width: 3px !important;
    }

    .border-4 {
        border-width: 4px !important;
    }

    .border-5 {
        border-width: 5px !important;
    }

    .border-6 {
        border-width: 6px !important;
    }

    .border-7 {
        border-width: 7px !important;
    }

    .border-8 {
        border-width: 8px !important;
    }

    .border-9 {
        border-width: 9px !important;
    }

    .border-10 {
        border-width: 10px !important;
    }

    .border-11 {
        border-width: 11px !important;
    }

    .border-12 {
        border-width: 12px !important;
    }

    .border-13 {
        border-width: 13px !important;
    }

    .border-14 {
        border-width: 14px !important;
    }

    .border-15 {
        border-width: 15px !important;
    }
}

.textColor1 {
    color: var(--color1) !important;
}

.textColor2 {
    color: var(--color2) !important;
}

.textColor3 {
    color: var(--color3) !important;
}

.textColor4 {
    color: var(--color4) !important;
}

.textColor5 {
    color: var(--color5) !important;
}

.textColor6 {
    color: var(--color6) !important;
}

.textColor7 {
    color: var(--color7) !important;
}

.textColor8 {
    color: var(--color8) !important;
}

.textColor9 {
    color: var(--color9) !important;
}

.bgColor1 {
    background: var(--color1) !important;
}

.bgColor2 {
    background: var(--color2) !important;
}

.bgColor3 {
    background: var(--color3) !important;
}

.bgColor4 {
    background: var(--color4) !important;
}

.bgColor5 {
    background: var(--color5) !important;
}

.bgColor6 {
    background: var(--color6) !important;
}

.bgColor7 {
    background: var(--color7) !important;
}

.bgColor8 {
    background: var(--color8) !important;
}

.bgColor9 {
    background: var(--color9) !important;
}