@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');





.section_container {
	padding:20px 0;
}

.l_gradient__black{
	display:none;
	position:absolute;
	background: linear-gradient( to right, rgb(0, 0, 0,0.5) 0%, rgba(0,0,0,0.01) 15%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 85%, rgba(0,0,0,0.1) 95%, rgb(0, 0, 0,0.5) 100% );
	width:100%;
	width:100%;
	height:100%;
	z-index:1;
}
.l_bg_image{
	background-position:50%;
	background-repeat:no-repeat;
	max-width:1920px;
	background-size:cover;
	margin:auto;
	position:relative;
}
.full_bg__content_relative{
	position:relative;
	z-index:2;
}



.c_button__block{
	position: relative;
	display:block;
	border:2px solid #EA1126;
	background-color: #EA1126;
	font-weight:700;
	font-size:17px;
	color:#fff;
	max-width: 250px;
	height: 54px;
	line-height: 54px;
	text-decoration: none;
	text-align: center;
	padding-left: 30px;
}


.c_button__block .c_button__icon{
	position:absolute;
	position: absolute;
    top: 45%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    font-size: 24px;
	margin-left:-35px;
}





.c_button__block:hover{
	background-color:rgba(234,17,38,0.9);
	color: #fff;
	text-decoration: none;
}

/*.c_button__block span{
	position: absolute;
	top: 30px;
	left: 30%;
	transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}*/


.c_button__white{
	border-color: #fff;
	background-color: transparent;
}

.c_button__white:hover{
	border-color: #fff;
	background-color: transparent;
}



.l_page__nav ul{
	display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap:8px;
}

.l_page__nav ul li{
	background-color: #fff;
	border-radius: 5px;
	border: 1px solid #ccc;
	color: #333;
	text-align: center;
	height: 40px;
	line-height: 40px;
}
.l_page__nav ul li a{
	display: block;
	color: #333;
	text-decoration: none;
	font-size: 13px;
	font-weight: 700;
}

.l_page__nav ul li.current-menu-item,
.l_page__nav ul li.current_page_item{
	border-radius: 5px;
	border: 1px solid #999;
}
.l_page__nav ul li.current-menu-item a,
.l_page__nav ul li.current_page_item a{
	color: #fff;
	background-color: #999;
}


/*
.l_page__nav ul li.current-menu-item,
.l_page__nav ul li.current_page_item{
	border-radius: 5px;
	border: 2px solid #ccc;
	border-image: linear-gradient(to right, #2D41B2, #F07B7B) 1;
}
.l_page__nav ul li.current-menu-item a,
.l_page__nav ul li.current_page_item a{
	color: #2D41B2;
  background: linear-gradient(90deg, #2D41B2 0%, #8E6392 80%);
    background-clip: border-box;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


.l_page__nav ul li.current-menu-item,
.l_page__nav ul li.current_page_item{
	position: relative;
	border: none;
	border-radius: 5px;
}
*/
/* グラデ枠を疑似要素で作る 
.l_page__nav ul li.current-menu-item::before,
.l_page__nav ul li.current_page_item::before{
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 5px;
	padding: 2px;
	background: linear-gradient(to right, #2D41B2, #F07B7B);
	-webkit-mask:
		linear-gradient(#fff 0 0) content-box,
		linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
}*/



.full_bg__content h2{
	text-align:center;
}


.p_content_header{
	text-align:center;
	margin-bottom:30px;
}

/* ===============================================
 Template
=============================================== */

.column__03_box{
	padding:20px;
}
.column__03_inner{
	margin-bottom:20px;
}
.column__03_box > .column__03_inner:last-child{
	margin-bottom:0;
}

.elementor__element{
	max-width:980px;
	margin:auto;
	}
.list_element{
	background-color: #fff;
	padding: 20px;
	border-radius: 10px;
	border: 1px solid #ddd;
	margin: 30px 0 0 !important;
}
 .list_element__image {
	 text-align: center;
}

.list_element .list_element__image img{
	margin:auto;
}
.list_element:nth-child(1) .list_element__image img{
	width:150px;
}
.list_element:nth-child(2) .list_element__image img{
	width:160px;
}
.list_element:nth-child(3) .list_element__image img{
	width:140px;
}
.list_element:nth-child(4) .list_element__image img{
	width:120px;
}


.list_element__image img{
}
.list_element__content dl dt{
	font-size:24px;
}
.list_element__content dl dd{
	margin-top:10px;
	line-height: 1.8;
}
.list_element__content dl dd a{
	position: relative;
	padding-left: 20px;
}
.list_element__content dl dd a span{
	position: absolute;
	top: 50%;
	left: 0%;  
	transform: translateY(-50%);  
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	font-size:16px;
}


.circle_menu{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap:0;
	max-width:320px;
	margin:20px auto;
}
.circle_menu article.circle{
	background-color:rgba(255, 255, 255, 0.7);
	border-radius:100%;
	width: 100px;
	height: 100px;
	text-align:center;
	color: #000;
	font-family: 'Inter', sans-serif;
	font-weight: bold;
	font-size: 12px;
	margin:auto;
	position: relative;
}
.circle_menu article.circle span{
	display:block;
	margin-top:15px;
	margin-bottom:2%;
	font-size:40px;
}

.circle_menu article.circle:before{
	font-size:30px;
	display: block;
	padding-top: 27%;
	margin-bottom:2%;
}



/* ===============================================
 Fllow
=============================================== */

.flow_list{
	max-width:980px;
	margin:auto;
}
.flow_list__item{
	position:relative;
	display: flex;
	padding-bottom:20px;
}
.flow_list__item::before {
  content: "";
  position: absolute;
  top:50px;
  left: 20px;
  z-index: 1;
  display: block;
  width: 0;
  height: calc(100% - 100px);
  border-right: 2px dotted #3C2C25;
}
.flow_list__item::after {
	content: "step_into";
  font-family: "Material Symbols Outlined";
  font-variation-settings:
    'FILL' 0,
    'wght' 400,
    'GRAD' 0,
    'opsz' 24;
	position:absolute;
	left:9px;
	bottom:10px;
	font-size:24px;
}
.flow_list__item:last-child::after {
	display:none;
}
.flow_list__item .step{
	position:absolute;
	line-height:44px;
	font-family: "Inter", sans-serif;
	font-size:30px;
	font-weight: bold!important;
	font-style: italic;
	width:40px;
	text-align:center;
}
.flow__content{
	border-bottom: 1px dotted #333;
	width: 100%;
	margin-left:50px;
	padding-top:10px;
	padding-bottom:40px;
}
.flow_list__item:last-child .flow__content{
	border-bottom:none;
}
.flow__content h3{
	margin-bottom:15px;
}

.flow__content .txt__box{
	background-color:#f5f5f7;
	padding:15px 25px;
	margin-top:15px;
}




/* ===============================================
 FAQ
=============================================== */
.faq_list{
	margin-bottom:40px;
}
.faq_list:last-child{
	margin-bottom:0;
}
.l_ttl__faq {
	margin:40px 10px 10px;
}
.faq_list:first-child .l_ttl__faq {
	margin:0 10px 20px;
}
.l_ttl__faq h2{
	text-align:left;
	font-size:24px;
}

.faq_list__item{
    overflow: hidden;
	border-bottom:1px dotted #333;
	padding:16px 10px;
}

.faq_list__question,
.faq_list__answer_body {
    cursor: pointer;
	position: relative;
	padding-left: 20px;
	padding-right:24px;
}
.faq_list__question_icon::before,
.faq_list__answer_icon::before{
	display: inline-block;
	width: 13px;
	height: 20px;
	left:0;
	position:absolute;
	font-weight: bold;
}


.faq_list__question_icon::before{
	content: "Q";
}
.faq_list__answer_icon::before{
	content: "A";
}




.faq_list__answer {
	height:0;
	overflow:hidden;
	transition:height .35s ease;
}
.accordion_item.active .faq_list__answer {
    height: auto;
}
	
.faq_list__question_button{
	display:inline-block;
	position:absolute;
	width:16px;
	height:16px;
	right:0;
	top:6px;
}

.faq_list__question_button::before{
	content: "";
	display: block;
	background: #333;
	height: 16px;
	width: 2px;
	right: 7px;
	position: absolute;
	transition: transform 0.3s;
}
.faq_list__question_button::after {
    content: "";
	display: block;
	background: #333;
    transition: transform 0.3s ease;
	position: absolute;
	height: 2px;
	width:16px;
	right: 0;
	top: 7px;
}


.faq_list__item.active .faq_list__question_button::after {
    content: "";
	display: block;
	background: #333;
    transition: transform 0.3s ease;
	position: absolute;
	height: 2px;
	width:16px;
	right: 7px;
	top: 7px;
}

.faq_list__item.active .faq_list__question_button::after {
    display: none
}

/* 回転：＋ → × */
.faq_list__item.active .faq_list__question_button::before {
  transform: rotate(90deg);
}
.faq_list__item.active .faq_list__question_button::after {
  transform: rotate(135deg);
}
.faq_list__answer {
    height: 0;
    overflow: hidden;
    transition: height 0.3s ease, padding 0.3s ease;
}
.faq_list__item.active .faq_list__answer {
    height: auto;
}
	
.faq_list__answer_body{
	padding:20px 24px 20px 20px;
}




.link__text{
	display:inline-block;
	position:relative;
	padding-left: 24px;
}

/* ===============================================
 icon
=============================================== */

.link__text::before{
	content: "keyboard_arrow_right";
	font-family: "Material Symbols Outlined";
	font-weight: normal;
	font-style: normal;
	font-size: 24px;
	line-height: 1;
	display: inline-block;
	font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
}



.icon_playground::before{
	content: "playground_2";
	font-family: "Material Symbols Outlined";
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	font-variation-settings:
		'FILL' 0,
		'wght' 400,
		'GRAD' 0,
		'opsz' 24;
}


.icon_dot::before{
	content:"background_dot_large";
	font-family:"Material Symbols Outlined";
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	font-variation-settings:
		'FILL' 0,
		'wght' 400,
		'GRAD' 0,
		'opsz' 24;
}
.icon_wall-art::before{
	content: "wall_art";
	font-family: "Material Symbols Outlined";
	font-weight: normal;
	font-style: normal;
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	font-variation-settings:
		'FILL' 0,
		'wght' 400,
		'GRAD' 0,
		'opsz' 24;
}







/* ===============================================
 color
=============================================== */

.bg__white{
	background-color:#fff;
}
.text__white{
	color:#fff;
}
.text__blue{
	color: #2D41B2;
}
.text__bold{
	font-weight:bold;
}
.font__size90{
	font-size:90%;
}
.font__size110{
	font-size:110%;
}
.font__size120{
	font-size:120%;
}
.font__size130{
	font-size:130%;
}



/* ===============================================
 768px~
=============================================== */
@media screen and (min-width:768px) {
	br.pc_br{
		display:block;
	}
	.l_page__nav ul{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap:8px;
}
	.column__03{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap:8px;
	}
	.circle_menu{
		max-width: 640px;
		margin:20px auto;
	}
	.circle_menu article.circle{
		width: 190px;
		height: 190px;
		font-size: 18px;
	}
	.circle_menu article.circle span{
		font-size:60px;
		margin-top: 40px;
	}
	.circle_menu article.circle:before{
		font-size:50px;
	}
}


/* ===============================================
 1024px~
=============================================== */
@media only screen and (min-width: 1024px) {
	
	
	.l_page__nav ul li {
		height: 50px;line-height: 50px;
	}
	.l_page__nav ul li a{
		font-size: 15px
	}
	
	.l_gradient__black{
		display:block;
	}
	.section_container {
		padding:60px 0;
	}
	.p_content_header {
		margin-bottom: 60px;
	}
	.column__03_box{
		padding:30px;
	}
	.list_element{
		padding: 20x 30px;
	}
	.list_element{
		display:flex;
	}
	.list_element__image{
		width:24%;
		padding-right:6%;
	}
	.list_element__content{
		width:70%;
	}
	.l_page__nav ul{
		display: grid;
		grid-template-columns: repeat(6, 1fr);
		gap:8px;
	}
	.column__03{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap:55px;
	}
	.circle_menu{
		margin:50px auto;
	}
	.l_ttl__faq {
		margin:60px 10px 20px;
	}
	.faq_list:first-child .l_ttl__faq {
		margin:0 10px 20px;
	}
	.flow_list__item::before {
		content: "";
		top:50px;
		left: 40px;
		height: calc(100% - 100px);
	}
	.flow_list__item::after {
		left:28px;
	}
	.flow_list__item .step{
		font-size:44px;
		top:0;
		width:80px;
		text-align:center;
	}
	.flow__content{
		margin-left:160px;
	}
	.faq_list__item{
		padding:16px;
	}
	.faq_list__question {
		padding-left: 36px;
	}
	.faq_list__answer_body{
		padding:20px 34px 20px 34px;
	}
}

/* ===============================================
 1240px~
=============================================== */
@media screen and (min-width: 1240px) {
	.faq_list{
		margin-bottom:60px;
	}
}



@media screen and (min-width: 1728px) {
	.l_gradient__black{
		display:block;
		background: linear-gradient(to right,rgba(0,0,0,1) 0%,rgba(0,0,0,0.4) 15%,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 70%,rgba(0,0,0,0.4) 85%,rgba(0,0,0,1) 100%);}
}