@charset "utf-8";
/*
Theme Name: tetote
Theme URI: https://tetote-web.jp
Version: 1.0
*/

/* common
---------------------------------------------------------------------------*/
@import url("css/easing.css");

:root {
	--color-text: #4C4336;
	/*--color-bg: #FBF9EB;*/
	--color-bg-dark: #F7EDDD;

	--font-gothic-jp-r: "MFW-PMaruAntipProN-Regular", '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'Hiragino Sans', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
	--font-gothic-jp-m: "MFW-PMaruAntipProN-Medium", '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'Hiragino Sans', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
	--font-gothic-jp-device: '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'Hiragino Sans', 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;

	--width-min: 0px;
	--width-mid: 1320;
	--scale-break-point: 1320px;
	--scale-rate: 0.1;
	--scale-rate-min: 0.5;
}

html { font-size: max(calc(1px + ((100vw - var(--scale-break-point))/1000 * var(--scale-rate))), calc(var(--width-min)/var(--width-mid))); }

@media (max-width: 1320px) {
	html { font-size: max(calc(1px + ((100vw - var(--scale-break-point))/1000 * var(--scale-rate-min))), calc(var(--width-min)/var(--width-mid))); }
}

body {
	overflow-y: scroll;
	background-color: var(--color-bg-dark);
	color: var(--color-text);
	font-size: 16rem;
	font-family: var(--font-gothic-jp-r);
	line-height: 1;
	font-feature-settings: 'palt' 1;
	-webkit-text-size-adjust: none !important;
}

body.noscroll { position: fixed; width: 100%; }

::-moz-selection { background: #EBEBEB; color: var(--color-text); }
::selection { background: #EBEBEB; color: var(--color-text); }

p { font-size: 16rem; line-height: 2; letter-spacing: 0.1em; margin-bottom: 1em; }
p:last-child { margin-bottom: 0 !important; }
address,i { font-style: normal; }
img { max-width: none; }
figure img { width: 100%; }
picture { display: block; }

.block { display: inline-block !important; }
.wide { display: inline-block !important; }
.narrow { display: none !important; }
.nav-sp, .btn-nav { display: none !important; }

.title-h1 { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* #loading
------------------------------------*/
#loading {
	display: block;
	opacity: 1;
	position: fixed;
	top: 50vh;
	left: 50vw;
	border: max(1rem, 1px) solid rgba(0,0,0,1);
	border-top-color: transparent;
	border-radius: 50%;
	width: 20rem;
	height: 20rem;
	margin: -10rem 0 0 -10rem;
	z-index: 99999;
	animation: spin .5s infinite linear;
}
@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

/* link
------------------------------------*/
a { color: var(--color-text); text-decoration: none; transition: .15s ease-out; -webkit-transform: translateZ(0); }
.hover { cursor: pointer; transition: .15s ease-out; }
a:hover,.hover:hover { opacity: 0.6; }
p a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.1em; }

.line { display: inline-block; position: relative; padding-bottom: max(1rem, 1px); line-height: 1; }
.line:after {
	display: block;
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: var(--color-text);
	width: 100%;
	height: max(1rem, 1px);
}


/* #wrap
---------------------------------------------------------------------------*/
#wrap { min-width: var(--width-min); }


/* header
---------------------------------------------------------------------------*/
header {
	width: 100%;
	margin: 0 auto;
	padding: 0;
}


/* footer
---------------------------------------------------------------------------*/
footer {
	width: 100%;
	margin: 0 auto;
	padding: 0;
	opacity: 0;
}


/* contents
---------------------------------------------------------------------------*/
#mainContents {
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	text-align: left;
}

.contents {
	opacity: 0;
}

/* p
------------------------------------*/
/*section p { text-align: justify; }
section p br { display: none; }*/


/* page top
---------------------------------------------------------------------------*/

/* .top-main
------------------------------------*/
.top-main {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%) !important;
	background: url(img/top/bg-top.svg) no-repeat center top / 100% auto;
	width: 647rem;
	padding: 134rem 0 186rem;
	text-align: center;
}

.top-main .logo {
	width: 305rem;
	margin: 0 auto 43rem;
}

.top-main .logo img {
	width: 100%;
}

.top-main h1,
.top-main h2 {
	font-size: 16rem;
	line-height: 2;
	letter-spacing: 0.1em;
}

.top-main h1 {
	margin-bottom: 0rem;
}

.top-main h2 {
	margin-bottom: 25rem;
}

.top-main p {
	font-size: 16rem;
}

.top-main figure {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%) !important;
	width: 403rem;
}

.top-main figure img {
	width: 100%;
}


/* page error
---------------------------------------------------------------------------*/


/* print
---------------------------------------------------------------------------*/
@media print {

}