@charset "utf-8";
::-moz-selection {
    background: #ffef37;
	color: #000000;
}
::selection {
    background: #ffef37;
	color: #000000;
}

body,button {
	font-family:"Zen Maru Gothic","游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック";
	font-size:16px;
	line-height: 1.8;
	font-weight: 500;
	text-align: center;
	color: #000000;
}
*{vertical-align: top; box-sizing: border-box; word-break: break-all;}
* ruby {vertical-align: baseline;}
@-moz-document url-prefix() {rt{margin-bottom: -0.5em;}}
a{color: #000000; text-indent: 0; text-decoration: underline;}
a:hover,button:hover{opacity: 0.6; text-decoration: none;}

a.honbun{display: none;}

.sp{display: none;}

.daruma{
	font-family: "Darumadrop One", "Zen Maru Gothic","游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック";
}


@media screen and (max-width: 700px){
	body {
		font-size:14px;
	}
}

_:lang(x)+_:-webkit-full-screen-document, .eng {
  font-weight: normal!important;
}

/* 印刷用スタイルシート */
@media print {
	/* ページ設定 */
	html {zoom: 0.6;}
	header,header h1,header .right_menu_box{position: absolute!important;}
	#mv .shindan_banner{animation:none!important;}
	
	header,footer{
		/* 背景画像を強制的に印刷 */
		-webkit-print-color-adjust: exact !important;
		print-color-adjust: exact !important;
		color-adjust: exact !important;
		background-attachment: scroll !important;
		/* Chrome用の追加対策 */
		opacity: 0.9999 !important;
		backface-visibility: hidden !important;
		-webkit-backface-visibility: hidden !important;
	}
}

/*=====================================================================================
***************************************************************************************

　　header
		
***************************************************************************************
=====================================================================================*/
header{
	position: fixed;
	z-index: 20;
	background-image: 
		url("../img/common/header_bg.png"),
		linear-gradient(to bottom, #ffef37 calc(100% - 100px), transparent calc(100% - 100px));
	background-position: bottom center, top center;
	background-repeat: repeat-x, repeat-x;
	background-size: auto 100px, 100% 100%;
	width: 100%;
	padding: 15px 15px 0 300px;
	text-align: justify;
	height: 100px;
	
	-webkit-print-color-adjust: exact; /* ここに追加 */
	print-color-adjust: exact; /* ここに追加 */
}

header h1{
	position: fixed;
	z-index: 21;
	left: 15px;
	top: 15px;
}

header .right_menu_box{
	display: flex;
	position: fixed;
	top: 20px;
	right: 35px;
	align-items: center;
}
header .right_menu_box > a{margin-right: 10px;}

header .b_btn{
	display: flex;
	width: 200px;
	height: 45px;
	border-radius: 25px;
	background: #000000;
	justify-content: center;
	align-items: center;
}

header .b_btn img{width: auto; display: block;}
header .b_btn img.sp{display: none;}

header .search_btn{
	display: flex;
	width: 45px;
	height: 45px;
	border-radius: 50%;
	background: #000000;
	justify-content: center;
	align-items: center;
}
header .search_btn img{width: auto; display: block;}


/* サイト内検索 */
header .site_search_box{
	position: fixed;
	right: 35px;
	top: -80px;
	width: 320px;
	transition: 0.5s;
}
header .site_search_box.open{
	top: 80px;
	transition: 0.5s;
}

header .site_search_box input[type="text"]{
	margin-top: 0;
	border: 2px solid #000000;
	font-size: 16px;
	padding: 15px 20px 15px 25px;
	border-radius: 25px;
}

header .site_search_box .search_icon{
	position: absolute;
    right: 10px;
    top: 10px;
    padding: 6px 10px;
	background: #ffef37;
	font-size: 13px;
	border-radius: 20px;
	/*background: url("../img/common/search_icon.svg") center no-repeat;
	background-size: cover;*/
	border: none;
	cursor: pointer;	
}
header .site_search_box .search_icon:hover{
	background: #000000;
	color: #ffef37;
}



/* ハンバーガーボタン */
.hamburger {
	background: #FFFFFF;
	border: none;
	border-radius: 25px;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 20px;
	transition: transform 0.3s ease;
}

.hamburger:hover {
transform: scale(1.1) rotate(5deg);
}

.hamburger.active {
transform: rotate(180deg);
}

.hamburger-icon {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 5px;
width: 25px;
}

.hamburger-icon span {
width: 20px;
height: 3px;
background: #000000;
border-radius: 3px;
transition: all 0.3s ease;
}

.hamburger.active .hamburger-icon span:nth-child(1) {
transform: translateY(8px) rotate(45deg);
}

.hamburger.active .hamburger-icon span:nth-child(2) {
opacity: 0;
transform: scale(0);
}

.hamburger.active .hamburger-icon span:nth-child(3) {
transform: translateY(-8px) rotate(-45deg);
}

.hamburger-text {
	color: #000000;
	font-weight: bold;
	font-size: 28px;
	line-height: 1;
}

/* メニュー本体 */
.menu {
position: fixed;
top: 0;
right: -100%;
width: 100%;
height: 100vh;
background: #ffef37;
transition: right 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
z-index: 1000;
padding: 30px;
overflow-y: auto;
display: flex;
flex-direction: column;
align-items: center;
}

.menu.active {
right: 0;
}

/* 閉じるボタン */
.close-button {
background: #eb739c;
border: none;
border-radius: 25px;
cursor: pointer;
display: flex;
align-items: center;
gap: 10px;
padding: 12px 20px;
transition: transform 0.3s ease;
box-shadow: 0 4px 15px rgba(255, 107, 157, 0.4);
align-self: flex-end;
margin-bottom: 180px;
}

.close-button:hover {
transform: scale(1.1) rotate(-5deg);
}

.close-icon {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 25px;
height: 25px;
position: relative;
}

.close-icon span {
width: 25px;
height: 3px;
background: white;
border-radius: 3px;
position: absolute;
}

.close-icon span:nth-child(1) {
transform: rotate(45deg);
}

.close-icon span:nth-child(2) {
transform: rotate(-45deg);
}

.close-button-text {
color: white;
font-weight: bold;
font-size: 16px;
}

/* メニューアイテムのコンテナ */
.menu-items {
width: 100%;
max-width: 1300px;
display: flex;
justify-content: center;
	flex-wrap: wrap;
}

.menu-item {
opacity: 0;
transform: translateX(50px);
transition: all 0.4s ease;
	width: 320px;
}

.menu.active .menu-item {
opacity: 1;
transform: translateX(0);
}

.menu.active .menu-item:nth-child(1) { transition-delay: 0.1s; }
.menu.active .menu-item:nth-child(2) { transition-delay: 0.2s; }
.menu.active .menu-item:nth-child(3) { transition-delay: 0.3s; }
.menu.active .menu-item:nth-child(4) { transition-delay: 0.4s; }
.menu.active .menu-item:nth-child(5) { transition-delay: 0.5s; }

.menu-item a {
display: block;
padding: 25px 10px;
margin:0 10px 15px;
background: #eb739c;
color: white;
text-decoration: none;
border-radius: 20px;
font-size: 19px;
font-weight: bold;
text-align: center;
transition: all 0.3s ease;
box-shadow: 0 5px 15px rgba(245, 87, 108, 0.3);
}

.menu-item a:hover {
transform: translateY(-5px) scale(1.05);
}

.menu-item:nth-child(odd) a {
background:#2c8bd2;
}



/* オーバーレイ */
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: rgba(0,0,0,0.5);
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
z-index: 999;
}

.overlay.active {
opacity: 1;
visibility: visible;
}



.sp_menu_box{display: none;}





@media screen and (max-width: 1240px){
	header .btn01{display: none;}

}

@media screen and (max-width: 1000px){
	header .b_my{display: none;}
	header .search_btn{display: none;}
}

@media screen and (max-width: 750px){
	header{
		background-image: 
			url("../img/common/header_bg.png"),
			linear-gradient(to bottom, #ffef37 calc(100% - 20px), transparent calc(100% - 20px));
		background-position: bottom center, top center;
		background-repeat: repeat-x, repeat-x;
		background-size: 70px auto, 100% 100%;
		height: 80px;
	}
	header h1 img{width: 125px;}
	
	header .right_menu_box{
		top: 10px;
		right: 11px;
	}
	header .b_btn{width: 150px;}
	header .b_btn img.pc{display: none;}
	header .b_btn img.sp{display: block;}
	
	.hamburger{
		width: 55px;
		height: 55px;
		border-radius: 50%;
		position: relative;
	}
	.hamburger-text{
		font-size: 12px;
		position: absolute;
		bottom: 10px;
		right: 13px;
	}
	.hamburger-icon{padding-bottom: 10px;}
	.hamburger:hover { transform:none;}
	
	.close-button{margin-bottom: 40px;}
	.menu-item a{
		font-size: 16px;
		padding: 10px;
	}
	.sp_menu_box{display: block;}
	header .sp_menu_box .site_search_box{
		position: relative;
		top: auto;
		right: auto;
	}
	header .sp_menu_box .b_my{
		display: flex; 
		margin: 20px auto; 
		width: 300px;
	}
	header .sp_menu_box .btn01{
		display: block; 
		margin: 0 auto;
		text-align: center;
	}
}


/*=====================================================================================
***************************************************************************************

　　中ページ上部
		
***************************************************************************************
=====================================================================================*/
#hed_box{
	width: 100%;
	background: url("../img/common/hed_bg.jpg") center bottom no-repeat;
	background-size: cover;
	padding: 240px 10px 20px;
}
#hed_box h2 img{max-width: 90%;}

#hed_box div{
	line-height: 1;
	background: #FFFFFF;
	padding: 15px 35px;
	font-size: 14px;
	max-width: 1200px;
	width: 95%;
	margin: 100px auto 0;
	text-align: justify;
	font-weight: bold;
	border-radius: 20px;
}
#hed_box div a{text-decoration: none;}



#contents_wrap{
	padding: 80px 0 120px;
	background: url("../img/common/contents_bg.jpg") top center repeat-y;
}

@media screen and (max-width: 750px){
	#hed_box{
		background: url("../img/common/hed_bg_sp.jpg") center bottom no-repeat;
		background-size: cover;
		padding: 140px 10px 10px;
		min-height: 330px;
	}
	#hed_box div{margin-top: 40px; font-size: 12px;}
	
	#contents_wrap{padding: 40px 0 60px;}
}




/*=====================================================================================
***************************************************************************************

　　footer
		
***************************************************************************************
=====================================================================================*/
footer .f_t_box{
	width: 100%;
	height: 100px;
	background: url("../img/common/footer_bg.png") top repeat-x;
}
footer .in_box{background: #ffef37; padding-bottom: 20px;}
footer .flex_box{
	max-width: 1200px;
	width: 90%;
	margin: 0 auto;
	text-align: justify;
	padding: 40px 0 100px;
	font-size: 14px;
	line-height: 1.3;
	font-weight: 900;
	
	display: flex;
	justify-content: space-between;
}

footer .bold{
	font-size: 18px;
	line-height: 1;
	margin: 40px 0 15px;
}

footer ul{margin-bottom: 70px;}
footer li{margin-bottom: 15px;}
footer li a{
	text-decoration: none;
	padding-left: 30px;
}
footer li:nth-child(1) a{
	background: url("../img/common/red.svg") no-repeat;
	background-size: 17px;
}
footer li:nth-child(2) a{
	background: url("../img/common/green.svg") no-repeat;
	background-size: 17px;
}
footer li:nth-child(3) a{
	background: url("../img/common/blue.svg") no-repeat;
	background-size: 17px;
}
footer li:nth-child(4) a{
	background: url("../img/common/pink.svg") no-repeat;
	background-size: 17px;
}


@media screen and (max-width: 750px){
	footer .sp{display: block;}
	footer .f_t_box {
		height: 25px;
		background: url(../img/common/footer_bg.png) top repeat-x;
		background-size: 70px;
	}
	footer .flex_box{display: block; font-size: 14px; padding-bottom: 40px;}
	
	footer .left_box{margin-bottom: 30px;}
	footer .left_box img{width: 170px; display: block; margin: 0 auto;}
	footer .bold{font-size: 16px; margin: 20px 0 15px;}
	
	footer ul{margin-bottom: 30px;}
	footer .right_box > a{
		display: block;
		margin: 0 auto;
		text-align: center;
	}
}