/* ******************************************************************
 *	File name		: style.css
 *	Summary			: css base
 * ******************************************************************
 */

/* -----------------------------------------------------------------
   base
----------------------------------------------------------------- */

html{
	background:#FFF;
}
#wrapper::before{
	content:" ";
	display:block;
	position:relative;
	width:100%;
	height:230px;
	background:url(../../image/base/second_bg.png) no-repeat center bottom;
	background-size:cover;
	transition-duration:0.5s;
}

header{
}
header::before{
	width:100%;
}
#pagetop{
	bottom:80px;
}
/* --- responsive --- */
@media only screen and (max-width:1000px){
	#wrapper{
		padding-top:90px;
	}
	#wrapper::before{
		height:200px;
		margin-bottom:20px;
	}
}
@media only screen and (max-width:767px){
	#wrapper::before{
		height:150px;
	}
}
@media only screen and (max-width:640px){
	#wrapper::before{
		height:130px;
	}
}
@media only screen and (max-width:420px){
	#wrapper::before{
		height:100px;
	}
}

#nav_line{
	display:none;
}
@media only screen and (max-width:1000px){
	#nav_line{
		display:block;
	}
}

/* -----------------------------------------------------------------
   main
----------------------------------------------------------------- */

main{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
	position:relative;
	width:1040px;
	max-width:100%;
	margin:0 auto;
	padding:0 20px;
}
main:has(#sub_contents){
	width:1140px;
}
#main_contents{
	position:relative;
	width:1000px;
	max-width:100%;
	margin:0px;
	padding:0px;
	background:#FFF;
}
main:has(#sub_contents) #main_contents{
	width:840px;
	max-width:calc(100% - 220px);
	margin:0px;
}

/* --- responsive --- */
@media only screen and (max-width:1000px){
	main{
		padding:20px;
	}
	main:has(#sub_contents) #main_contents{
		width:100%;
		max-width:100%;
		margin:0px;
	}
}

/* -----------------------------------------------------------------
   pnkz
----------------------------------------------------------------- */

#pnkz{
	position:relative;
	width:100%;
	margin:0 auto 100px;
	padding:10px 0;
	max-width:100%;
	text-align:left;
	background:none;
	list-style:none;
	z-index:100;
	}
	#pnkz *{
		font-size:0.87rem;
		color:#000;
	}
	#pnkz ul{
		position:relative;
		width:100%;
		max-width:100%;
		margin:0 auto;
		list-style:none;
	}
	#pnkz ul li{
		display:inline-block;
		position:relative;
		padding-left:30px;
		color:#000;
		}
		#pnkz ul li:first-child{
			padding-left:0px;
		}
		#pnkz ul li::before{
			content:" ";
			position:absolute;
			top:calc(50% - 5px);
			left:0px;
			width:7px;
			height:7px;
			border-top:1px solid #000;
			border-right:1px solid #000;
			margin:0 10px;
			transform:scale(1,0.7) rotate(45deg);
		}
		#pnkz ul li:first-child::before{
			display:none;
		}
		#pnkz ul li a{
			text-decoration:none;
			color:#000;
		}
		#pnkz ul li a:hover{
			text-decoration:underline;
}
/* --- responsive --- */
@media only screen and (max-width:1000px){
	#pnkz{
		display:none;
	}
}

/* -----------------------------------------------------------------
   sub_contents
----------------------------------------------------------------- */

#sub_contents{
	position:relative;
	width:190px;
}
#sub_contents > ul{
	width:100%;
	}
	#sub_contents > ul.job_tags li{
	}
	#sub_contents > ul.wp-tag-cloud li:first-child{
			border-top:none !important;
	}
	#sub_contents > ul > li{
		position:relative;
		border-bottom:2px dotted var(--base-color);
	}
	#sub_contents > ul > li:first-child{
		border-top:2px dotted var(--base-color);
	}
	#sub_contents > ul > li > a{
		display:-webkit-flex;
		display:flex;
		justify-content:flex-start;
		align-items:center;
		position:relative;
		width:100%;
		height:100%;
		padding:10px 0;
		font-weight:normal;
		font-size:0.95rem;
		text-align:left;
		text-decoration:none;
		color:#000;
		transition-duration:0.5s;
	}
	#sub_contents > ul > li.active a,
	#sub_contents > ul > li a:hover{
		color:var(--base-color);
	}
	#sub_contents > ul > li::after{
		content:" ";
		position:absolute;
		top:7px;
		left:-40px;
		width:13px;
		height:13px;
		border:7px solid var(--base-color);
		-moz-border-radius:50%;
		-webkit-border-radius:50%;
		border-radius:50%;
		transition-duration:0.5s;
		opacity:0;
	}
	#sub_contents > ul > li.active::after,
	#sub_contents > ul > li:hover::after{
		opacity:1;
	}

.sub_contents_sub li{
	transition-duration:0.5s;
	}
	.sub_contents_sub li:first-child{
		border-top:none !important;
	}
	.sub_contents_sub li a{
		display:-webkit-flex;
		display:flex;
		justify-content:flex-start;
		align-items:center;
		position:relative;
		width:100%;
		padding:0px 0 10px 20px;
		font-weight:normal;
		font-size:0.95rem;
		text-align:left;
		text-decoration:none;
		color:#000;
		transition-duration:0.5s;
}


/* --- responsive --- */
@media only screen and (max-width:1000px){
	#sub_contents{
		width:100%;
		margin:0 0 50px;
	}
	#sub_contents > ul > li,
	#sub_contents > ul > li:first-child{
		width:100%;
	}
	#sub_contents > ul > li a{
		padding:10px 0 10px 38px;
		font-size:0.8rem;
	}
	#sub_contents > ul > li a br{
		display:none;
	}
	#sub_contents > ul > li::after{
		top:8px;
		left:0px !important;
	}

	.sub_contents_sub{
		margin-bottom:10px;
	}
	.sub_contents_sub li{
		transition-duration:0.5s;
		}
		.sub_contents_sub li a{
			padding:0px 0 0px 60px !important;
	}
}

/* -----------------------------------------------------------------
   page_title
----------------------------------------------------------------- */

#page_title{
	position:relative;
	width:100%;
}
#page_title h2{
	position:relative;
	width:100%;
	margin:0 0 50px;
	padding-bottom:20px;
	font-weight:bold;
	font-size:2.5rem;
	text-align:left;
	color:var(--base-color);
	}
	#page_title h2::before,
	#page_title h2::after{
		content:" ";
		position:absolute;
		bottom:-7px;
		width:65px;
		height:7px;
	}
	#page_title h2::before{
		left:65px;
		background:var(--base-color);
		z-index:1;
	}
	#page_title h2::after{
		left:0px;
		background:#FFE555;
		z-index:2;
}

/* --- responsive --- */
@media only screen and (max-width:1000px){
	#page_title h2{
		font-size:2.0rem;
		text-align:center;
	}
	#page_title h2::before{
		left:50%;
	}
	#page_title h2::after{
		left:auto;
		right:50%;
	}
}

/* -----------------------------------------------------------------
   shigle_title
----------------------------------------------------------------- */

#shigle_title{
	position:relative;
	width:100%;
}
#shigle_title h2{
	position:relative;
	width:100%;
	margin:0 0 40px;
	padding-bottom:30px;
	font-weight:bold;
	font-size:2.0rem;
	text-align:left;
	border-bottom:2px solid #B7B7B7;
	color:#000;
	line-height:1.35;
}

/* -----------------------------------------------------------------
   h3
----------------------------------------------------------------- */

#main_contents h3{
	position:relative;
	margin:0 0 20px;
	padding:13px 0px 13px 0px;
	font-weight:bold;
	font-size:1.3rem;
	color:var(--base-color);
}
main:has(#sub_contents) #main_contents h3{
	padding:13px 10px 13px 15px;
	background:#FFF7C7;
	border-left:12px solid #FFE555;
}

#main_contents h3 span.sub{
	display:block;
	margin:4px 0 0;
	font-weight:bold;
	font-size:1.0rem;
}

/* -----------------------------------------------------------------
   h4
----------------------------------------------------------------- */

#main_contents h4{
	position:relative;
	margin:0 0 10px;
	font-weight:bold;
	font-size:1.3rem;
	color:var(--base-color);
}

/* --- responsive --- */
@media only screen and (max-width:1000px){
	#main_contents h4{
		font-size:1.1rem;
	}
}

/* -----------------------------------------------------------------
   p
----------------------------------------------------------------- */

main p{
	position:relative;
	margin-bottom:15px;
	font-weight:400;
	font-size:1.0rem;
	text-align:left;
	line-height:2.0;
}
@media only screen and (max-width:767px){
}

/* -----------------------------------------------------------------
   lr_flame
----------------------------------------------------------------- */

.lr_flame{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
	}
	.lr_flame .lr_flame_box{
		position:relative;
		width:48.5%;
		margin:0 0 25px;
		padding:25px 15px 15px;
		text-align:center;
		border:1px solid var(--base-color);
		-moz-border-radius:15px;
		-webkit-border-radius:15px;
		border-radius:15px;
	}
	.lr_flame .lr_flame_box.flame_box_full{
		width:100%;
	}
	#main_contents .lr_flame .lr_flame_box h4{
		margin:0 0 10px !important;
		padding:0px;
		font-size:1.1rem !important;
		background:none !important;
	}
	.lr_flame .lr_flame_box p{
		font-size:0.87rem;
	}
	.lr_flame .lr_flame_box p:last-child{
		margin-bottom:0px;
	}
	.lr_flame .lr_flame_box a{
		font-weight:500;
		color:var(--base-color);
	}
	.lr_flame .lr_flame_box ul li{
		font-size:0.87rem !important;
	}
	.lr_flame .lr_flame_box .box_btn,
	.lr_flame .lr_flame_box .box_btn_g{
		height:60px;
}

/* --- responsive --- */
@media only screen and (max-width:1000px){
	.lr_flame .lr_flame_box{
		width:100%;
	}
}
@media only screen and (max-width:767px){
	.lr_flame .lr_flame_box .box_btn,
	.lr_flame .lr_flame_box .box_btn_g{
		height:50px;
	}
}

/* -----------------------------------------------------------------
   page_head
----------------------------------------------------------------- */

#page_head{
	position:relative;
	height:450px;
	margin:0 0 80px;
	}
	#page_head:has(#page_menu){
		height:520px;
}

/* -----------------------------------------------------------------
   shop_lr_list
----------------------------------------------------------------- */

.shop_lr_list > ul{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
}
.shop_lr_list > ul > li{
	width:390px;
	max-width:49%;
	margin:0 0 30px;
}
#main_contents .shop_lr_list > ul > li h4{
	margin:0 0 10px !important;
	padding:0px !important;
	background:none !important;
}
.shop_lr_list > ul > li h4 a{
	font-weight:bold;
	font-size:1.5rem;
	text-decoration:underline;
	color:var(--base-color);
	line-height:1.4;
}
.shop_lr_list > ul > li p{
	font-size:0.87rem;
	line-height:1.5;
}
.shop_lr_list > ul > li:first-child .handling{
	margin-top:37px;
}
.shop_lr_list > ul > li .handling{
	margin:0 0 15px;
	}
	.shop_lr_list > ul > li .handling p{
		margin:0px;
		line-height:1.75;
	}
	.shop_lr_list > ul > li .handling ul li{
		font-size:0.87rem;
}
.shop_lr_list > ul > li .map{
	position:relative;
	width:100%;
	height:220px;
	margin:0 0 10px;
	border:0px solid var(--base-color);
}
.shop_lr_list > ul > li .map iframe{
	width:100%;
	height:100%;
	border:0;
}

/* --- responsive --- */
@media only screen and (max-width:1000px){
	.shop_lr_list > ul{
		display:block;
	}
	.shop_lr_list > ul > li{
		width:100%;
		max-width:100%;
	}
	.shop_lr_list > ul > li h4 a{
		font-size:1.3rem;
	}
	.shop_lr_list > ul > li h4 br{
		display:none;
	}
	.shop_lr_list > ul > li:first-child .handling{
		margin-top:0px;
	}
}

/* -----------------------------------------------------------------
   point_infomation
----------------------------------------------------------------- */

.point_infomation{
	display:-webkit-flex;
	display:flex;
	justify-content:center;
	align-items:center;
	flex-wrap:wrap;
	position:relative;
	width:100%;
	min-height:55px;
	padding:5px 10px;
	font-weight:bold;
	text-align:center;
	border:2px solid var(--base-color);
	color:var(--base-color);
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	}
	.point_infomation p{
		display:block;
		width:100%;
		margin:0px !important;
		color:#000;
		text-align:center;
	}
	.point_infomation p.strong{
		display:block;
		padding:7px 0;
		font-weight:bold;
		font-size:1.2rem;
		color:var(--base-color);
}

/* -----------------------------------------------------------------
   page_menu
----------------------------------------------------------------- */

#page_menu{
	position:relative;
	width:900px;
	max-width:100%;
	height:70px;
	margin:0 auto;
	}
	#page_menu ul{
		display:-webkit-flex;
		display:flex;
		-webkit-box-pack:justify;
		-ms-flex-pack:justify;
		justify-content:space-between;
		height:100%;
	}
	#page_menu ul li{
		position:relative;
		width:100%;
		height:100%;
	}
	#page_menu ul li a{
		display:-webkit-flex;
		display:flex;
		justify-content:center;
		align-items:center;
		width:100%;
		height:100%;
		padding-right:10px;
		font-size:1.0rem;
		color:#000;
		transition-duration:0.5s;
		}
		#page_menu ul li a::after{
			content:" ";
			position:absolute;
			top:calc(50% - 3px);
			right:10px;
			border: 6px solid transparent;
			border-top:6px solid rgba(0,0,0,1);
			transition-duration:0.5s;
		}
		#page_menu ul li a:hover{
			text-decoration:none;
			background:rgba(0,0,0,0.05);
			color:#00ABEB;
			}
			#page_menu ul li a:hover::after{
				border-top:6px solid #00ABEB;
}

/* --- responsive --- */
@media only screen and (max-width:767px){
	#page_menu{
		height:auto;
		padding:20px;
		}
		#page_menu ul{
			flex-wrap:wrap;
		}
		#page_menu ul li{
			width:49%;
			height:50px;
			margin:0 0 10px;
			border:1px solid rgba(0,0,0,0.2);
		}
		#page_menu ul li a{
			font-size:0.87rem;
	}
}

/* -----------------------------------------------------------------
   section
----------------------------------------------------------------- */

section.fadein{
	transition:0.8s ease-in-out;
	transform:translateY(30px);
	opacity:0;
}
section.fadein.active{
	transform:translateY(0px);
	opacity:1;
}

section{
	position:relative;
	width:100%;
	max-width:100%;
	margin:0 auto 80px;
	text-align:left;
}
.contents{
	position:relative;
	width:1440px;
	max-width:100%;
	margin:0 auto;
	padding:20px 20px 90px;
}
.contents_box{
	position:relative;
	width:900px;
	max-width:100%;
	margin:0 auto 90px;
	padding:0px;
}

/* --- responsive --- */
@media screen and (max-width:767px){
}

/* ----- */

.section_title{
	position:relative;
	left:-20px;
	width:900px;
	max-width:calc(100% + 80px);
	margin:0 auto 20px;
	padding:20px;
	text-align:left;
	line-height:1.5;
	}
	.section_title h2{
		font-weight:600;
		font-size:2.8rem;
	}
	.section_title p{
		font-weight:400;
		font-size:1.2rem;
		letter-spacing:2px;
}

/* --- responsive --- */
@media screen and (max-width:1040px){
	.section_title{
		left:0px;
		width:100%;
		max-width:100%;
		padding:0px;
	}
}
/* --- responsive --- */
@media screen and (max-width:640px){
	.section_title h2{
		font-size:2.0rem;
	}
	.section_title p{
		font-size:1.0rem;
	}
}

/* -----------------------------------------------------------------
   table_scroll
----------------------------------------------------------------- */

/* --- responsive --- */
@media screen and (max-width:767px){
	.table_scroll{
		overflow:auto;
		margin-bottom:20px;
		cursor:pointer;
		}
		.table_scroll table{
			margin-bottom:10px;
			width:767px !important;
			max-width:767px !important;
		}
		.table_scroll::-webkit-scrollbar{
			height:10px;
		}
		.table_scroll::-webkit-scrollbar-track{
			background: #555;
			-moz-border-radius:6px;
			-webkit-border-radius:6px;
			border-radius:6px;
		}
		.table_scroll::-webkit-scrollbar-thumb {
			background: #BCBCBC;
			-moz-border-radius:5px;
			-webkit-border-radius:5px;
			border-radius:5px;
	}
}

/* -----------------------------------------------------------------
   accordion
----------------------------------------------------------------- */

.accordion_box{
	position:relative;
	margin:0 0 10px;
	border:1px solid #707070;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	}
	.accordion_box .accordion_title{
		position:relative;
		margin:0px !important;
		padding:15px 45px 15px 15px;
		cursor:pointer;
	}
	.accordion_title:hover{
		transition-duration:0.5s;
		background:rgba(0,0,0,0.1);
	}
	.accordion_title::before,
	.accordion_title::after{
		content:" ";
		position:absolute;
		top:32px;
		right:20px;
		width:15px;
		height:2px;
		background:rgba(0,0,0,0.7);
	}
	.accordion_title::after{
		transition-duration:0.5s;
		width:15px;
		transform:rotate(90deg);
		}
		.accordion_title.active::after{
			width:0px;
			right:27px;
	}
	.accordion_box .accordion_title p{
		margin-bottom:0px;
		padding-left:70px;
	}
	.accordion_box .accordion_title span{
		position:absolute;
		top:18px;
		left:18px;
		font-weight:bold;
		font-size:1.8rem;
		color:var(--base-color);
	}
	.accordion_box .answer{
		display:none;
		position:relative;
		padding:20px 15px 20px 85px;
		}
		.accordion_box .answer::before{
			content:" ";
			position:absolute;
			top:0px;
			left:18px;
			width:calc(100% - 36px);
			height:2px;
			background:#B7B7B7;
	}
	.accordion_box .answer span{
		position:absolute;
		top:28px;
		left:18px;
		font-weight:bold;
		font-size:1.8rem;
		color:var(--base-color);
	}
	.accordion_box .answer p{
		margin-bottom:0px;
}

/* --- responsive --- */
@media only screen and (max-width:767px){
	.accordion_box .accordion_title p,
	.accordion_box .answer p{
		font-size:0.87rem;
	}
}


/* -----------------------------------------------------------------
   table
----------------------------------------------------------------- */

table{
	position:relative;
	width:100%;
	border-collapse:collapse;
	border-spacing:0px;
	border:1px solid #DDD;
	line-height:2;
}
table th,
table td{
	min-width:120px;
	padding:10px;
	text-align:center;
	font-size:1.0rem;
}
table th{
	background:#F6F7FA;
	border:1px solid #DDD;
	color:#000;
}
table td{
	border:1px solid #DDD;
}

/* --- responsive --- */
@media screen and (max-width:767px){
	table th,
	table td{
		font-size:0.87rem;
	}
}
/* --- responsive --- */
@media screen and (max-width:500px){
	table th,
	table td{
		font-size:0.77rem;
	}
}

/* -----------------------------------------------------------------
   ul
----------------------------------------------------------------- */

#main_contents ul{
	margin-bottom:10px;
	list-style:none;
	}
	#main_contents ul li{
		margin:0 0 12px;
		font-size:1.2rem;
		text-align:left;
}

#main_contents ul.disc{
	display:block;
	list-style:none;
	}
	#main_contents ul.disc li{
		position:relative;
		width:100%;
		margin-bottom:0px;
		padding-left:15px;
		font-weight:500;
		font-size:1.0rem;
	}
	#main_contents ul.disc li::before{
		content:" ";
		position:absolute;
		top:7px;
		left:0px;
		width:9px;
		height:9px;
		-moz-border-radius:50%;
		-webkit-border-radius:50%;
		border-radius:50%;
		background:var(--base-color);
}

/* -----------------------------------------------------------------
   colorbox
----------------------------------------------------------------- */

.colorbox{
	position:relative;
	width:900px;
	max-width:100%;
	margin:50px auto;
	padding:40px;
	text-align:left;
	background:rgba(0,0,0,0.1);
}
.colorbox p{
	font-size: 1.05rem;
}
.colorbox p:last-child{
	margin:0px;
}


/* -----------------------------------------------------------------
   lr_box
----------------------------------------------------------------- */

.lr_box{
	display:-webkit-flex;
	display:flex;
	-webkit-box-pack:justify;
	-ms-flex-pack:justify;
	justify-content:space-between;
	flex-wrap:wrap;
	}
	.lr_box .lr_text{
		position:relative;
		flex:1;
	}
	.lr_box figure{
		max-width:100%;
		margin-left:30px;
}
/* --- responsive --- */
@media screen and (max-width:1000px){
	.lr_box .lr_text{
		flex:none;
		width:100% !important;
		margin-bottom:15px;
	}
	.lr_box figure{
		width:100%;
		text-align:center;
		margin:0px auto;
	}
}


