@charset "utf-8";

/*----------------------------------------*/
/* 共通設定 */
/*----------------------------------------*/

:root{
	--main-font-color: #0a0a0a;
	--link-font-color: #938630;
	--sub-gold: #938630;
	--sub-white: #ffffff;
	--sub-gray: #888888;

    --space120: 120px;
    --space120-40: 120px;
    --space80: 80px;
    --space60: 60px;
    --space40: 40px;
    --space30: 30px;
    --space20: 20px;
    --space15: 15px;
    --space10: 10px;
    --space80-60: 80px;
    --space60-40: 60px;
    --space40-30: 40px;
    --space30-20: 30px;
    --space20-15: 20px;

    --fs60: 6rem;
    --fs40: 4rem;
    --fs32: 3.2rem;
    --fs24: 2.4rem;
    --fs20: 2rem;
    --fs18: 1.8rem;
    --fs18-16: 1.8rem;
    --fs16: 1.6rem;
    --fs15: 1.5rem;
    --fs14: 1.4rem;
    --fs13: 1.3rem;
    --fs12: 1.2rem;
}


/*----------------------------------------*/
/* 基本パーツ */
/*----------------------------------------*/

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


html{
	font-size: 62.5%;
}

body{
	margin: 0;
	font-family: "Noto Serif JP", serif;
    font-optical-sizing: auto;
    font-style: normal;
	font-size: var(--fs16);
    font-optical-sizing: auto;
    font-style: normal;
	font-weight: 400;
	letter-spacing: 0.05em;
	line-height: 1.8;
	color: var(--main-font-color);
	word-wrap: break-word;
}

img{
	width: 100%;
}


/* --- PC・Tab・SP表示切替 --- */
.pc{
	display: block;
}
.pc_only{
	display: block;
}
.tablet{
	display: none;
}
.sp{
	display: none;
}


/* --- 余白 --- */
.inner{
	padding: 0 40px;
	margin-left: auto;
	margin-right: auto;
}

.w1360{
	max-width: 1440px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.w1100{
	max-width: 1180px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.w800{
	max-width: 880px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}



/* --- テキストリンク・ボタン ---*/
a, a::before, a::after, a:hover{
	transition: 0.3s ease;
	cursor: pointer;
}

a{
    color: var(--main-font-color);
	text-decoration: none;
}

a:hover{
    color: var(--link-font-color);
}


/* --- ヘッダー・MVのフェード表示 ---*/
.js_fade{
    opacity: 0;
    animation-name: js_fade;
    animation-duration: 2s;
    animation-timing-function: ease;
    animation-delay: .5s;
    animation-fill-mode: forwards;
}
@keyframes js_fade{
    0%{
        opacity: 0;
    }
    100%{
        opacity: 1;
    }
}

/* --- その他セクションのフェードイン表示 ---*/
.js_fadeUp{
    opacity: 0;
    visibility: hidden;
    transform: translateY(50px);
    transition: opacity 1s, visibillity 1s, transform 1s;
}

.js_fadeUp.on{
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}




@media screen and (max-width: 1280px){
	/* --- 小型PC・タブレット用 --- */
	
	/*----------------------------------------*/
    /* 共通設定 */
    /*----------------------------------------*/
	:root{
        --space120: 80px;
        --space120-40: 80px;
        --space80: 60px;
        --space60: 40px;
        --space40: 30px;
        --space30: 15px;
        --space20: 15px;
        --space15: 10px;
        --space10: 8px;
        --space80-60: 60px;
        --space60-40: 40px;
        --space40-30: 30px;
        --space30-20: 20px;
        --space20-15: 15px;

        --fs60: 4.8rem;
        --fs40: 3.2rem;
        --fs32: 2.4rem;
        --fs24: 2rem;
        --fs20: 1.8rem;
        --fs18: 1.6rem;
        --fs18-16: 1.6rem;
        --fs16: 1.4rem;
        --fs15: 1.3rem;
        --fs14: 1.2rem;
        --fs13: 1.2rem;
        --fs12: 1rem;
    }

    /* --- 余白 --- */
    .inner{
        padding-left: 30px;
        padding-right: 30px;
    }
	
}


@media screen and (max-width: 959px){
	/* --- タブレット＆スマホ用 --- */

	/*----------------------------------------*/
    /* 共通設定 */
    /*----------------------------------------*/
    :root{
        --space120: 80px;
        --space120-40: 80px;
        --space80: 40px;
        --space60: 30px;
        --space40: 20px;
        --space30: 15px;
        --space20: 10px;
        --space15: 10px;
        --space10: 5px;

        --fs60: 3.2rem;
        --fs40: 2.8rem;
        --fs32: 2rem;
        --fs24: 1.8rem;
        --fs20: 1.6rem;
        --fs18: 1.4rem;
        --fs16: 1.4rem;
        --fs15: 1.3rem;
        --fs14: 1.2rem;
        --fs13: 1.2rem;
        --fs12: 1rem;
    }

    /* --- 余白 --- */
    .inner{
        padding-left: 15px;
        padding-right: 15px;
    }

    /* --- テキストリンク・ボタン --- */
    a.btn{
        padding: 15px 30px;
    }

	/* --- PC・Tab・SP表示切替 --- */
	.pc{
		display: none!important;
	}

	.sp{
		display: block;
	}
	
}


@media screen and (max-width: 479px){
	/* --- スマホ用 --- */

    /*----------------------------------------*/
    /* 共通設定 */
    /*----------------------------------------*/
	:root{
        --space120-40: 40px;
    }
	
	/* --- PC・Tab・SP表示切替 --- */
	.pc{
		display: none!important;
	}

	.sp{
		display: block;
	}

	/* --- 余白 --- */
	.inner{
		padding: 0 20px;
	}
	
}