@charset "utf-8"; @import url("reset.css"); @import url("common_sp.css") only screen and (max-width: 768px);
@import url("common_pc.css") only screen and (min-width: 769px);
/*================================
	Layout, Elements
================================*/
.clearfix:after,input[type=text],input[type=password],input[type=tel],input[type=url],input[type=email],input[type=file],input[type=image],input[type=number],input[type=range],input[type=color],input[type=date],input[type=datetime],input[type=datetime-local],input[type=month],input[type=week],input[type=time],input[type=search],select,textarea {
    display: block
}

blockquote,body,button,code,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,legend,li,ol,p,pre,select,td,textarea,th,ul {
    margin: 0;
    padding: 0
}

a,a:active,a:hover,a:link,a:visited {
    text-decoration: none;
    outline: 0
}

li,ul {
    list-style: none
}

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

caption,th {
    text-align: left
}

h1,h2,h3,h4,h5,h6 {
    font-weight: inherit
}

.clearfix:after {
    content: " ";
    clear: both
}

* {
    color: #333;
    font-size: 12px;
    box-sizing: border-box;
    letter-spacing: .02rem;
    line-height: 1.6;
    border-radius: 0;
    letter-spacing: 1px;
}

html {
    font-size: 10px;
    background: #FFF;
    height: 100%
}

body {
    font-family: Avenir,"Helvetica Neue",Helvetica,Arial,Roboto,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","Meiryo UI","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    min-height: 100vh;
    display: flex;
    display: -webkit-flex;
    flex-direction: column;
    -webkit-flex-direction: column
}

main {
}

button,input[type=submit],input[type=reset],input[type=search],input[type=button],select,textarea {
    /* appearance:none; */
    -moz-appearance: none;
    /* -webkit-appearance:none; */
}

button,input,select,textarea {
    /* font-family:inherit; */
    /* font-weight:inherit; */
    /* outline:0; */
    /* border:1px solid #333; */
    /* background-color:#FFF; */
}

button,input[type=submit],input[type=reset],input[type=file],input[type=color],input[type=button] {
    cursor: pointer
}

input[type=file],input[type=image],input[type=color] {
    border: none;
    background-color: transparent
}

select {
    /* text-indent:.01px; */
    text-overflow: '';
    /* background-image:url(under_arrow.svg); */
    /* background-position:100% center; */
    /* background-repeat:no-repeat; */
    /* padding:0 20px 0 10px; */
}

select::-ms-expand {
    display: none
}

textarea {
    overflow: auto;
    resize: vertical
}

canvas,iframe,img,svg,video {
    border: 0;
    max-width: 100%;
    display: block
}

@media screen and (max-width: 480px) {
    * {
        font-size:1.3rem
    }

    input,select,textarea {
        font-size: 1.6rem
    }

    input[type=checkbox]:checked {
        background-color: #3B99FC
    }

    input[type=radio] {
        border-radius: 1rem
    }

    input[type=radio]:checked {
        background-color: #3B99FC;
        border-radius: 1rem
    }
}

* {
    line-height: 1.8em;
}

main {
    overflow: hidden;
}

* {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
}

.mincho {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
}

.barlow {
    font-family: 'Barlow Semi Condensed', sans-serif;
    font-weight: 400;
}
.sawarabi {
    font-family: 'Sawarabi Mincho', sans-serif;
}
.cormorant {
    font-family: 'Cormorant', serif;
}



.bar_effect1 .active span:nth-of-type(1) {
    -webkit-transform: translateY(12px) rotate(-45deg);
    transform: translateY(12px) rotate(-45deg);
    background: #fff!important;
}

.bar_effect1 .active span:nth-of-type(2) {
    opacity: 0;
}

.bar_effect1 .active span:nth-of-type(3) {
    -webkit-transform: translateY(-8px) rotate(45deg);
    transform: translateY(-8px) rotate(45deg);
    background: #fff!important;
}

.bar_effect2 .active span:nth-of-type(1) {
    -webkit-transform: translateY(17px) rotate(-315deg);
    transform: translateY(17px) rotate(-315deg);
    background: #fff!important;
}

.bar_effect2 .active span:nth-of-type(2) {
    opacity: 0;
}

.bar_effect2 .active span:nth-of-type(3) {
    -webkit-transform: translateY(-4px) rotate(315deg);
    transform: translateY(-4px) rotate(315deg);
    background: #fff!important;
}

.bar_effect3 .active {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
}

.bar_effect3 .active span:nth-of-type(1) {
    -webkit-transform: translateY(11px) rotate(-45deg);
    transform: translateY(11px) rotate(-45deg);
}

.bar_effect3 .active span:nth-of-type(2) {
    -webkit-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg);
}

.bar_effect3 .active span:nth-of-type(3) {
    opacity: 0;
}

.bar_effect4 span:nth-of-type(3), .bar_effect4 .active span:nth-of-type(3) {
    transition: none;
}

.bar_effect4 .active {
    -webkit-transform: rotateX(720deg);
    transform: rotateX(720deg);
}

.bar_effect4 .active span:nth-of-type(1) {
    -webkit-transform: translateY(11px) rotate(-45deg);
    transform: translateY(11px) rotate(-45deg);
}

.bar_effect4 .active span:nth-of-type(2) {
    -webkit-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg);
}

.bar_effect4 .active span:nth-of-type(3) {
    opacity: 0;
}

.bar_effect5 span:nth-of-type(1) {
    -webkit-animation: menu-bar01 .75s forwards;
    animation: menu-bar01 .75s forwards;
}

@-webkit-keyframes menu-bar01 {
    0% {
        -webkit-transform: translateY(12px) rotate(45deg);
    }

    50% {
        -webkit-transform: translateY(12px) rotate(0);
    }

    100% {
        -webkit-transform: translateY(0) rotate(0);
    }
}

@keyframes menu-bar01 {
    0% {
        transform: translateY(12px) rotate(45deg);
    }

    50% {
        transform: translateY(12px) rotate(0);
    }

    100% {
        transform: translateY(0) rotate(0);
    }
}

.bar_effect5 span:nth-of-type(2) {
    transition: all .25s .25s;
    opacity: 1;
}

.bar_effect5 span:nth-of-type(3) {
    -webkit-animation: menu-bar02 .75s forwards;
    animation: menu-bar02 .75s forwards;
}

@-webkit-keyframes menu-bar02 {
    0% {
        -webkit-transform: translateY(-12px) rotate(-45deg);
    }

    50% {
        -webkit-transform: translateY(-12px) rotate(0);
    }

    100% {
        -webkit-transform: translateY(0) rotate(0);
    }
}

@keyframes menu-bar02 {
    0% {
        transform: translateY(-12px) rotate(-45deg);
    }

    50% {
        transform: translateY(-12px) rotate(0);
    }

    100% {
        transform: translateY(0) rotate(0);
    }
}

.bar_effect5 .active span:nth-of-type(1) {
    -webkit-animation: active-menu-bar01 .75s forwards;
    animation: active-menu-bar01 .75s forwards;
}

@-webkit-keyframes active-menu-bar01 {
    0% {
        -webkit-transform: translateY(0) rotate(0);
    }

    50% {
        -webkit-transform: translateY(12px) rotate(0);
    }

    100% {
        -webkit-transform: translateY(12px) rotate(45deg);
    }
}

@keyframes active-menu-bar01 {
    0% {
        transform: translateY(0) rotate(0);
    }

    50% {
        transform: translateY(12px) rotate(0);
    }

    100% {
        transform: translateY(12px) rotate(45deg);
    }
}

.bar_effect5 .active span:nth-of-type(2) {
    opacity: 0;
}

.bar_effect5 .active span:nth-of-type(3) {
    -webkit-animation: active-menu-bar03 .75s forwards;
    animation: active-menu-bar03 .75s forwards;
    bottom: -2px;
    width: 15px;
    background: #B2B2B2;
}

@-webkit-keyframes active-menu-bar03 {
    0% {
        -webkit-transform: translateY(0) rotate(0);
    }

    50% {
        -webkit-transform: translateY(-10px) rotate(0);
    }

    100% {
        -webkit-transform: translateY(-10px) rotate(-45deg);
    }
}

@keyframes active-menu-bar03 {
    0% {
        transform: translateY(0) rotate(0);
    }

    50% {
        transform: translateY(-10px) rotate(0);
    }

    100% {
        transform: translateY(-10px) rotate(-45deg);
    }
}

.bar_effect6 .active span:nth-of-type(1) {
    -webkit-transform: translateY(8px) rotate(-45deg);
    transform: translateY(8px) rotate(-45deg);
}

.bar_effect6 .active span:nth-of-type(2) {
    left: 200%;
    opacity: 0;
    -webkit-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-animation: active-menu-bar02 .8s forwards;
    animation: active-menu-bar02 .8s forwards;
}

@-webkit-keyframes active-menu-bar02 {
    100% {
        height: 0;
    }
}

@keyframes active-menu-bar02 {
    100% {
        height: 0;
    }
}

.bar_effect6 .active span:nth-of-type(3) {
    -webkit-transform: translateY(-13px) rotate(45deg);
    transform: translateY(-13px) rotate(45deg);
}

/*---------------------------------------------------------------*\
	$768px
\*---------------------------------------------------------------*/
@media screen and (max-width: 768px) {
}