/* CSS Document */


/*- menu -*

header, footer, rule, other, class

* filetop *
------------------------------------------------------------------------------------------------------------------------------------------*/


/* reset：20180615.ver_1.1 版
---------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, a, address, big,
em, img, small, strong, b, i,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, embed, figure, figcaption, 
footer, header, nav, output, ruby, section,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style: normal;
	font-weight: normal;
	font-size: 100%;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, iframe,
footer, header, hgroup, menu, nav, section, img, svg {
	display: block;
}

ol, ul{
    list-style: none;
}

table{
    border-collapse: collapse; 
    border-spacing: 0;
}

caption, th{
    text-align: left;
}

img{
	display: block;
	max-width: 100%;
	height: auto;
}

a{
	transition: 0.6s;
	color: #000000;
}

a:focus {
	outline: none;
}

html{
	overflow-y: scroll;
	font-size: 62.5%;
}


/* body
---------------------------------------------------------------------*/
body{
	overflow-x: hidden;
	position: relative;
	min-height: 100vh;
	line-height: 1.8;
    font-size: 1.6rem;
}

body, body *{
	font-family: "Noto Sans JP", sans-serif;
  	font-optical-sizing: auto;
  	font-style: normal;
	box-sizing: border-box;
	color: #000000;
}

main, main *{
	color: #333333;
}



/*- common.css -*/

/*------------------------------------------------------------------------------------------------------------------------------------------

* all

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/





/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
    
    
    
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* header

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
header{
	border-bottom: 1px solid #CCCCCC;
	background: #FFFFFF;
}

header .hinner{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	margin-right: auto;
	margin-left: auto;
}

header .hinner h1{
	padding: 10px;
}

header .hinner h1 img{
	display: block;
    height: 40px;
    width: auto;
}

/* ar_r */
header .hinner .ar_r{
	display: inline-flex;
	align-items: center;
	column-gap: 8px;
	text-decoration: none;
	font-size: 1.4rem;
	color: #666;
	padding: 10px;
}

header .hinner .ar_r::after{
	content: "";
	display: block;
	background: url("../img/header/ar_red_r.svg") no-repeat center;
	background-size: contain;
	aspect-ratio: 1 / 1;
	width: 14px;
}

/* SNSボタン */
header .hinner .sns_share_btn{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	column-gap: 10px;
	background: #EEE;
	line-height: 1;
	padding: 10px;
	width: 100%;
	border-top: 1px solid #CCCCCC;
}

header .hinner .sns_share_btn a,
header .hinner .sns_share_btn img{
	cursor: pointer;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {

	header .hinner{
		width: 960px;
	}

	header .hinner h1{
		padding: 10px 0;
		order: 1;
	}

	header .hinner h1 img{
		height: 48px;
	}

	/* ar_r */
	header .hinner .ar_r{
		font-size: 1.6rem;
		padding: 10px 0;
		order: 3;
	}

	header .hinner .ar_r::after{
		height: 14px;
		width: 14px;
	}

	/* SNSボタン */
	header .hinner .sns_share_btn{
		border-top: none;
	}
	
	header .hinner .sns_share_btn{
		background: none;
		width: auto;
		order: 2;
	}
	
	header .hinner .sns_share_btn .line{
		display: none;
	}
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* footer

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
footer{
	background: #FFFFFF;
}

footer #footer_dl{
	display: grid;
	row-gap: clamp(28px, 2.5vw, 32px);
	padding: clamp(28px, 2.5vw, 32px) clamp(16px, 3.125vw, 40px);
	margin: 0 auto;
	max-width: 1040px;
}

footer #footer_dl .left h2{
	padding: 0 16px;
}

footer #footer_dl .right .list_btn{
	display: flex;
	column-gap: clamp(24px, 2.5vw, 32px);
	padding: 0 16px;
}

footer #footer_dl .right .list_btn > *{
	width: calc((100% - (clamp(24px, 2.5vw, 32px) * 1)) / 2);
}

footer #footer_dl .right .list_btn > *:nth-of-type(odd) img{
	margin-left: auto;
}

footer #footer_dl .right .list_btn a img{
	height: clamp(42px, 4.53125vw, 58px);
}

footer #footer_dl .right .text{
	margin-top: clamp(28px, 2.5vw, 32px);
}

footer #footer_dl .right .text li{
	padding-left: 1.2rem;
	text-indent: -1.2rem;
	font-weight: 500;
	font-size: 1.2rem;
	color: #90939C;
}

footer #footer_dl .right p.sp{
	text-align: center;
}

footer #footer_dl .right p.sp a{
	text-decoration: underline;
	font-weight: 500;
	font-size: 1.2rem;
	color: #90939C;
}

footer #copyright{
	background: #F2F4F0;
	text-align: center;
	font-weight: 500;
	font-size: 1.2rem;
	color: #333333;
	padding: clamp(20px, 2.5vw, 32px) 16px;
}





/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	footer #footer_dl{
		grid-template-columns: repeat(2, 1fr);
		column-gap: clamp(24px, 3.75vw, 48px);
		align-items: center;
	}
	
	footer #footer_dl .left h2{
		padding: 0;
	}
	
	footer #footer_dl .left h2 img{
		height: 80px;
	}
	
	footer #footer_dl .left p.pc{
		text-align: center;
		margin-top: 16px;
	}
	
	footer #footer_dl .left p.pc a{
		text-decoration: underline;
		font-weight: 500;
		font-size: 1.2rem;
		color: #90939C;
	}
	
	footer #footer_dl .left p.pc a:hover{
		text-decoration: none;
	}
	
	footer #footer_dl .right .list_btn{
		padding: 0;
	}
	
	footer #footer_dl .right .list_btn > *{
		width: auto;
	}
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* other

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/

/* anchor_links */
#anchor_links .inner{
	background-color: #FFFFFF;
	border-bottom: 1px solid #CCCCCC;
	padding: clamp(8px, 1.25vw, 16px) clamp(5px, 1.302083vw, 10px);
}

#anchor_links .inner > *{
	display: flex;
	column-gap: clamp(5px, 1.302083vw, 10px);
	align-items: center;
	justify-content: space-between;
	margin-right: auto;
	margin-left: auto;
	max-width: 1040px;
}

#anchor_links .inner > * h2,
#anchor_links .inner .list_btn > *{
	width: calc((100vw - ((clamp(5px, 1.302083vw, 10px) * 2) + (clamp(5px, 1.302083vw, 10px) * 2))) / 3);
}

#anchor_links .inner > * h2{
	max-width: 220px;
}

#anchor_links .inner .list_btn{
	display: flex;
	column-gap: clamp(5px, 1.302083vw, 10px);
}

#anchor_links .inner .list_btn > *{
	max-width: 180px;
}

#anchor_links .inner .list_btn a[class*="al_btn"]{
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: clamp(6px, 0.625vw, 8px);
	position: relative;
	font-weight: 600;
	font-size: clamp(1rem, 1.09375vw, 1.4rem);
	height: clamp(43.5px, 3.75vw, 48px);
	transition: unset;
}

#anchor_links .inner .list_btn a[class*="al_btn"]::after{
	content: "";
	display: block;
	position: absolute;
	background: url("../img/icon/arrow01.svg") no-repeat center;
	background-size: contain;
	aspect-ratio: 1 / 1.444;
	transform: translateY(-50%);
	width: clamp(6px, 0.703125vw, 9px);
	right: clamp(5px, 1.302083vw, 10px);
	top: 50%;
}

#anchor_links .inner .list_btn a.al_btn_a{
	background-color: #F6EDA0;
}

#anchor_links .inner .list_btn a.al_btn_b{
	background-color: #FFD378;
}

#anchor_links .inner .list_btn a.al_btn_c{
	background-color: #FF9296;
}

#anchor_links .inner .list_btn a[class*="al_btn"]:hover{
	background-color: #99dcb1;
}

/* returnTop */
#returnTop{
	z-index: 999999;
	position: fixed;
	bottom: 10px;
	right: 10px;
}

#returnTop img{
	transition: ease-in .3s all;
	cursor: pointer;
	height: 60px;
	width: 60px;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
    
    /* anchor_links */
	
	#anchor_links .list_btn{
		column-gap: clamp(18px, 2.8125vw, 36px);
	}
    
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
    
    /* returnTop */
	#returnTop img:hover{
		opacity: 0.7;
	}
    
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
    
    /* returnTop */
	#returnTop{
		bottom: 20px;
		right: 40px;
	}
    
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* class

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/

.pc{
	display: none;
}

/* title */
h3.title{
	position: relative;
	text-align: center;
	font-weight: 600;
	font-size: clamp(2.4rem, 3.125vw, 4rem);
}

h3.title::after{
	content: "";
	display: block;
	position: absolute;
	background: url("../img/icon/circles.svg") no-repeat center;
	background-size: contain;
	aspect-ratio: 1 / 0.429;
	width: clamp(20px, 3.125vw, 40px);
	transform: translate(-50%, clamp(10px, 1.40625vw, 18px));
	bottom: 0;
	left: 50%;
}

h4.title{
	position: relative;
	font-family: "Noto Serif JP", serif;
  	font-optical-sizing: auto;
  	font-weight: 500;
  	font-style: normal;
	font-size: clamp(4.2rem, 5.46875vw, 7rem);
	color: #00a73c;
	padding-left: clamp(48px, 6.25vw, 80px);
	padding-top: clamp(8px, 1.25vw, 16px)
}

h4.title::before{
	content: "01";
	display: block;
	position: absolute;
	background-image: linear-gradient(135deg, #00a73c, #00a73c 50%, transparent 50%, transparent);
	border-radius: 50%;
	aspect-ratio: 1 / 1;
	width: clamp(80px, 10vw, 128px);
	text-indent: clamp(1.2rem, 1.09375vw, 1.4rem);
	font-family: "Noto Serif JP", serif;
  	font-optical-sizing: auto;
  	font-weight: 500;
  	font-style: normal;
	font-size: clamp(3rem, 3.90625vw, 5rem);
	color: #FFFFFF;
	line-height: 1.4;
	left: 0;
	top: 0;
}

/* center_box */
.center_box{
	padding: 0 clamp(16px, 2.5vw, 32px);
}

.center_box > *{
	margin-right: auto;
	margin-left: auto;
	max-width: 1040px;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {

    .pc{
		display: block;
	}
	
	.sp{
		display: none;
	}
    
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* info_single

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/
#info_single main{
	background-color: #fdfbec;
}

#info_single #single_contents h2{
	border-bottom: 2px solid #f6eda0;
	background-color: #FFFFFF;
	text-align: center;
	font-weight: 500;
	font-size: clamp(2rem, 3.125vw, 4rem);
	line-height: 1.4;
	padding: clamp(16px, 2.5vw, 32px) clamp(10px, 1.25vw, 16px);
}

#info_single #single_contents .inner{
	padding: clamp(50px, 7.8125vw, 100px) clamp(10px, 1.25vw, 16px);
}

#info_single #single_contents .inner > *{
	margin-inline: auto; 
	max-width: 960px;
}

#info_single #single_contents .inner .contents_box > * + *{
	margin-top: clamp(50px, 7.8125vw, 100px);
}

#info_single #single_contents .inner .contents_box h3{
	font-weight: 600;
	font-size: clamp(2.4rem, 2.5vw, 3.2rem);
}

#info_single #single_contents .inner .contents_box h4{
	font-weight: 600;
	font-size: clamp(2rem, 1.875vw, 2.4rem);
}

#info_single #single_contents .inner .contents_box a{
	text-decoration: underline;
	color: #0000EE;
}

#info_single #single_contents .inner .contents_box a:hover{
	text-decoration: none;
}

#info_single #single_contents .inner .return_btn_text{
	margin-top: clamp(50px, 7.8125vw, 100px);
}

#info_single #single_contents .inner .return_btn_text .return_btn{
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	background-color: #ff9296;
	position: relative;
	font-weight: 600;
	font-size: clamp(1.4rem, 1.25vw, 1.6rem);
	margin-inline: auto; 
	height: clamp(36px, 3.75vw, 48px);
	width: clamp(135px, 14.0625vw, 180px);
	transition: unset;
}

#info_single #single_contents .inner .return_btn_text .return_btn:hover{
	background-color: #99dcb1;
}

#info_single #single_contents .inner .return_btn_text .return_btn::after{
	content: "";
	display: block;
	position: absolute;
	background: url("../img/icon/arrow01.svg") no-repeat center;
	background-size: contain;
	aspect-ratio: 1 / 1.444;
	transform: translateY(-50%);
	width: clamp(6px, 0.703125vw, 9px);
	right: clamp(5px, 1.302083vw, 10px);
	top: 50%;
}




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	#info_single #single_contents .inner .contents_box > * + *{
		margin-top: clamp(20px, 3.125vw, 40px);
	}
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}







/*------------------------------------------------------------------------------------------------------------------------------------------

* Add Sample Code

------------------------------------------------------------------------------------------------------------------------------------------*/

/* screen width 768px未満
---------------------------------------------------------------------*/




/* 横向き用
---------------------------------------------------------------------*/

@media (orientation: landscape) {
}




/* TAB用768px～（TAB）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 768px) {
	
	
	
}




/* iPad pro・ノートPC用1024px～（NPC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1024px) {
	
	
	
}




/* PC用1280px～（PC）
---------------------------------------------------------------------*/

@media print,screen and (min-width: 1280px){
	
	
	
}


