@charset "UTF-8";
/*-------------------------
初期設定
-------------------------*/
*{box-sizing: border-box;}
body{
	font-family: 'Noto Sans JP', sans-serif;
	color: #333333;
	font-size: 14px;
	font-weight: 400;
	line-height: 2;
	letter-spacing: 1px;
}

ul,li,ol{list-style: none;}
img,svg{max-width: 100%; width: auto; vertical-align: bottom;}
a{color: #333333; transition: 0.3s ease-in; text-decoration: none;}
a:hover{opacity: 0.7;}

main p small,
main .cap_text{font-size: 10px; display: inline-block;}

@media screen and (max-width: 640px){
	main p small{font-size: 11px;}
}

/* 表示・非表示 */
.pc_only{display: block;}
.pc_tab_only{display: block;}
.tab_only{display: none;}
.sp_tab_only{display: none;}
.sp_only{display: none;}

@media screen and (max-width: 960px){
	.pc_only{display: none;}
	.pc_tab_only{display: block;}
	.tab_only{display: block;}
	.sp_tab_only{display: block;}
	.sp_only{display: none;}
}

@media screen and (max-width: 640px){
	.pc_only{display: none;}
	.pc_tab_only{display: none;}
	.tab_only{display: none;}
	.sp_tab_only{display: block;}
	.sp_only{display: block;}
}

#main{overflow: hidden; display: block; padding: 0 0 40px;}

figure{position: relative;}
figcaption,
.cap{font-size: 10px; position: absolute; right: 0; bottom: -20px; padding: 3px 6px; color: #333333;}
figcaption.white{bottom: 0; color: #fff; background: none; background: rgba(0,0,0,0.5);}
figcaption.white.capRight{text-align: right;}
figcaption.capLeft{right: auto; left: 0;}


/*-------------------------
タイトル
-------------------------*/
#title_sec{margin-top: 30px;}
#titleWrap{display: flex; justify-content: center; flex-wrap: wrap; align-items: center;    margin-bottom: 20px;}
#titleWrap > figure{width: 100%; margin:0 30px 0 0;max-width: 180px;}
#titleWrap > h2{width: auto; max-width: calc(100% - 210px);font-size: 35px; letter-spacing: .5rem; line-height: 1.5;}
#titleLead{margin: 30px auto;}


.contents_title,
.contents_title h3{margin: 0 auto 30px;}
.contents_title h3{ text-align: center;}

@media screen and (max-width: 960px){

}

@media screen and (max-width: 640px){
#titleWrap figure,
#titleWrap h2{width:100%; max-width: 100%; text-align: center;font-size: 18px;letter-spacing: .2rem}
#titleWrap figure {margin: 0 auto 20px;}
#titleWrap figure img,
#titleWrap figure svg {max-width: 180px;}	
	
.contents_title h3{ font-size: 16px;}	
	
}



/*-------------------------
ページ共通
-------------------------*/
.contents_sec{margin: 40px auto 120px;}
.inner{
	max-width: 980px;
    width: 100%;
    margin: 0 auto;
    padding: 0 15px;
}
 .inner + .inner{margin:80px auto 0;}
.flex{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.sec_text{margin: 15px auto;}
.toggle_wrap{display: none;}
.hidden{overflow: hidden;}

@media screen and (max-width: 1200px){
}

@media screen and (max-width: 960px){

}

@media screen and (max-width: 640px){

	.inner + .inner{margin:40px auto 0;}
}


/*-------------------------
header
-------------------------*/
header{background: #f8f8f8; padding: 20px 0; position: relative;}
header .inner{max-width: 1230px;}
.header_content{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.header_logo{width: 40%;}
.header_nav{width: 60%;}

.header_nav{display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center;}
.h_backNumber{max-width: 210px; width: 100%; margin: 0 15px; padding: 5px; 
	border: 1px solid #8d8d8d; text-align: center;
	font-size: 16px; font-weight: bold; position: relative; transition: 0.3s ease;}
.h_backNumber:hover{cursor: pointer; background: #8d8d8d;}
.h_backNumber span{display: block; width: 10px; height: 10px;
	border-top: 1px solid #333; border-left: 1px solid #333; transform: rotate(45deg);
	position: absolute; top: 18px; right: 13px; transition: 0.3s ease;}
.h_backNumber.open span{transform: rotate(225deg);}

header .accordion_wrap{display: none;
	padding: 20px 0; background: #efefef;
	position: absolute; bottom: 0; left: 0; z-index: 9999;
	width: 100%; transform: translateY(100%);}
.h_nav_inner{max-width: 750px; width: 100%; margin: 0 auto;}
.nav_wrap + .nav_wrap{margin-top: 20px;}
.nav_wrap .nav_title{font-size: 16px; font-weight: bold; position: relative; margin-bottom: 15px;}
.nav_wrap .nav_title::before{content: ""; width: 100%; height: 1px; background: #333; display: block; 
	position: absolute; left: 0; top: 50%;}
.nav_wrap .nav_title span{background: #efefef; position: relative; z-index: 2; padding-right: 15px;}
.nav_wrap ul{display: flex; flex-wrap: wrap;}
.nav_wrap ul li{width: 25%; position: relative; padding-left: 20px; margin-bottom: 20px;}
.nav_wrap ul li::before{content: ""; display: block; 
	border-left: 10px solid #333; border-top: 6px solid transparent; border-bottom: 6px solid transparent;
	position: absolute; left: 0; top: 7px;}
.nav_wrap ul li a{display: block; font-size: 13px; position: relative;}
.nav_wrap ul li a::after{content: ""; width: 0; height: 1px; background: #333;
	position: absolute; bottom: 0; left: 0; transition: 0.3s ease;}
.nav_wrap ul li a:hover{opacity: 1;}
.nav_wrap ul li a:hover::after{width: 100%;}

.h_sp_navBtn{display: none;}
.accordion_wrap .toggle_wrap{display: block;}

@media screen and (max-width: 960px){
	.header_logo{width: 35%;}
	.header_nav{width: 65%;}
	.h_nomura-pt{width: 50%;}
	.h_backNumber{max-width: 180px;}
}
@media screen and (max-width: 640px){
	header{padding: 15px 0;}
	header .inner{padding: 0 10px;}
	.header_logo{width: 43%;}
	.header_nav{width: 57%;}

	.h_nomura-pt{width: calc(100% - 46px); padding: 0 10px;}
	.h_menu{width: 46px; font-size: 12px; font-weight: bold; line-height: 1.4; text-align: center; color: #a2a2a2;
		position: relative; z-index: 10000; transition: 0.3s ease; padding: 2px 5px;}
	.h_menu span{width: 100%; height: 4px; background: #a2a2a2; display: block; transition: 0.3s ease; transform-origin: left;}
	.h_menu span:nth-child(2){margin: 8px 0;}
	.h_menu.open{background: #b7b7b7; color: #fff;}
	.h_menu.open span{background: #fff;}
	.h_menu.open span:nth-child(1){transform: rotate(45deg) translate(6px, -3px);}
	.h_menu.open span:nth-child(2){opacity: 0;}
	.h_menu.open span:nth-child(3){transform: rotate(-45deg) translate(1px, 7px);}

	header .accordion_wrap{position: fixed; top: 0; bottom: 0;
		transform: translateY(0); padding: 70px 0 0;}
	.h_nav_inner{padding: 0 10px;}
	.h_sp_navBtn{display: block; background: #cacccb; font-size: 16px; line-height: 1.5; margin-top: 2px;
		font-weight: bold; padding: 14px 10px; position: relative;}
	.h_sp_navBtn a{display: block;}
	.h_sp_navBtn small{font-size: 10px; font-weight: normal; display: block;}

	.toggle_btn span{display: block; width: 25px; height: 25px; border: 1px solid #333;
		position: absolute; top: 50%; right: 10px;
	    transform: translateY(-50%);}
	.toggle_btn span::before{content: ""; 
		width: 12px; height: 1px; background: #333; display: block;
		position: absolute; top: 50%; left: 6px; transform: translateY(-50%);}
	.toggle_btn span::after{content: "";
		width: 1px; height: 12px; background: #333; display: block;
		position: absolute; top: 6px; left: 50%; transform: translateX(-50%); transition: 0.3s ease;}
	.toggle_btn.open span::after{opacity: 0;}

	.navBtn_link span{display: block; width: 20px; height: 20px; 
		border-top: 2px solid #fff; border-right: 2px solid #fff;
		position: absolute; top: 50%; right: 16px;
	    transform: translateY(-50%) rotate(45deg);}

	.accordion_wrap .toggle_wrap{display: none; background: #e3e3e3; padding: 10px 20px;
		overflow-y: scroll; height: 70vh;}
	.nav_wrap + .nav_wrap{margin-top: 10px;}
	.nav_wrap .nav_title span{background: #e3e3e3;}
	.nav_wrap .nav_title{margin-bottom: 8px;}
	.nav_wrap ul li{width: 100%; margin-bottom: 14px;}
	.nav_wrap ul li a{font-size: 15px;}
}

/*-------------------------
footer
-------------------------*/
footer{background: #8d8d8d; color: #fff; padding: 0 0 15px;}
footer a{color: #fff;}
footer .inner{max-width: 1230px;}

.f_topWrap{align-items: flex-start;}
.f_top{max-width: 920px; width: 100%; margin: 0 auto; padding: 45px 0;}
.f_topWrap_left{width: 45%;}
.f_topWrap_right{width: 55%;}

.f_topWrap_left p{font-size: 20px; font-weight: bold;}
.f_topWrap_inquiry{max-width: 310px; margin-top: 10px;}
.f_topWrap_inquiry a{font-size: 13px; line-height: 1.2; padding: 15px 5px;
	display: block; background: #fff; color: #8d8d8d; text-align: center;}
.f_topWrap_inquiry span{background: url(../img/elements/icon_pencil.svg) no-repeat left center; background-size: contain; padding: 0 40px;}
.f_topWrap_right p{font-size: 16px;}

.f_bottom{border-top: 1px solid #fff; padding: 20px 0 40px;}
.f_bottom ul{display: flex; flex-wrap: wrap; justify-content: center;}
.f_bottom ul li{margin: 0 50px;}
.f_bottom ul li a{font-size: 16px;}

.copyright{text-align: center; font-size: 12px;}

#topback{position: fixed; bottom: 0; right: 0; z-index: 10;
	width: 60px; height: 60px; overflow: hidden;}
#topback a{background: #b7b7b7; height: 100%;
	display: flex; flex-direction: column; justify-content: space-between;
	font-size: 10px; text-align: center;}
#topback a span{display: block; width: 20px; height: 20px; margin: 0 auto;
	border-top: 2px solid #fff; border-left: 2px solid #fff; transform: rotate(45deg) translate(15px,12px);}

@media screen and (max-width: 640px){
	footer{padding: 0 0 10px;}
	footer .inner{padding: 0;}

	.f_top{text-align: center; padding: 30px 0 20px;}
	.f_topWrap_left{width: 100%; margin-bottom: 18px;}
	.f_topWrap_right{width: 100%;}
	
	.f_topWrap_left p{font-size: 12px; line-height: 1.5;}
	.f_topWrap_inquiry{max-width: 260px; margin: 15px auto 0;}
	.f_topWrap_inquiry a{padding: 10px 5px;}
	.f_topWrap_right p{font-size: 12px; line-height: 1.5;}

	.f_bottom{padding: 10px 0 30px;}
	.f_bottom ul li{margin: 0 15px;}
	.f_bottom ul li a{font-size: 12px;}


	.copyright{font-size: 10px; padding: 0 70px 0 15px; text-align: left;}
}
	

/*-------------------------
present_sec
-------------------------*/

.present_sec{margin-top: 100px;}

.present_sec .present_wrap{border: 1px solid #d6d6d6;; padding: 30px; position: relative;}
.present_wrap > h3{position: relative; z-index: 1; margin-left: 100px; color: #eb5c01;margin-bottom: 20px;}
.present_sec .itemHead{position: absolute; top:-52px;left: -1px;}
.present_sec .presentColor{color: #eb5c01;}
.present_item{padding: 15px 0 0;}

.present_item h3,.present_item h4{margin-bottom: 10px;}


.present_sec .oubobtn{margin: 15px auto 0;text-align: center;border-top: 1px solid #333333;padding-top: 20px;}
.present_sec .oubobtn_wrap{display: inline-block;margin: 0 auto 15px;}
.present_sec .campaign_close{display: none;}
.present_sec .campaign_open{display: block;}

.ouboBtnBox{
	min-height: 60px;
    align-items: center;
    display: flex;
    /* flex-wrap: wrap; */
border: 1px solid #ffffff;border-radius: 8px;box-shadow: 0px 0px 15px -5px #777777;
border-radius: 6px;}
.ouboBtnBox span,
.ouboBtnBox a{margin: 0 auto;font-weight: bold; padding: 10px;}
.ouboBtn_open a{color: #ffffff; font-weight: bold;width: 100%;}
.oubo_day{color: #000000; font-size: 12px;}

.ouboBtn_close{
background: rgb(227,227,227);
background: -moz-linear-gradient(180deg, rgba(227,227,227,1) 0%, rgba(149,149,149,1) 100%);
background: -webkit-linear-gradient(180deg, rgba(227,227,227,1) 0%, rgba(149,149,149,1) 100%);
background: linear-gradient(180deg, rgba(227,227,227,1) 0%, rgba(149,149,149,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e3e3e3",endColorstr="#959595",GradientType=1);}
.ouboBtn_close{display: none;}



.ouboBtn_open{background: rgb(250,173,243);
background: -moz-linear-gradient(180deg, rgba(250,173,243,1) 0%, rgba(249,32,183,1) 61%);
background: -webkit-linear-gradient(180deg, rgba(250,173,243,1) 0%, rgba(249,32,183,1) 61%);
background: linear-gradient(180deg, rgba(250,173,243,1) 0%, rgba(249,32,183,1) 61%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#faadf3",endColorstr="#f920b7",GradientType=1);font-size: 20px;line-height: 1;}

@media screen and (max-width: 960px){		

}

@media screen and (max-width: 640px){
.present_sec .itemHead{ top:-35px;max-width: 80px;}	
.present_wrap .flex .box_left,
.present_wrap .flex .box_right{width: 100%;}
.present_wrap > h3{margin-left: 0; margin-top: 30px; text-align: center;}	
}


/*-------------------------
contents_cap
-------------------------*/
.contents_cap{font-size: 11px; margin-top: 40px;}

