@charset "utf-8";

html::after{
    content: '';
	width: 10px;
    background: #e29820;
	display: block;
    position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
    z-index: 99;
}
body {
    min-width: 1300px;
    position: relative;
    margin:0 auto;
	-webkit-font-feature-settings: "palt";
}

/* 共通 */
.mb20{margin-bottom: 20px!important;}
.mb40{margin-bottom: 40px!important;}
.mb80{margin-bottom: 80px!important;}
.fs18,.fs18 *{font-size: 18px!important;}
.fs20{font-size: 20px!important;}
.fs26{font-size: 26px!important;}
.fs40{font-size:40px;}
.bgg{background:#f7f5f2;}
.center{text-align: center;}
.wb,.wb *{font-weight: bold;}
.flex-start,.flexbox{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.flex-start{align-items: flex-start;}
.c2 > *{width: 48%;}
.c3 > *{width: 32%;}
.c2 > li:not(:nth-last-child(-n+2)) {margin-bottom: 30px;}
.c3 > li:not(:nth-last-child(-n+3)) {margin-bottom: 30px;}
.li_mb10 > li:not(:last-child){margin-bottom: 10px;}
.sp_on{display: none;}
.lh200{line-height: 200%;}
.list > li{display: flex;}
.list > li::before{
	content: "";
	background: #e29820;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	flex-shrink: 0;
	margin: 7px 10px 0 0;
}
.ibm-plex-serif-regular {
  font-family: "IBM Plex Serif", serif;
  font-weight: 400;
  font-style: normal;
}
/* ヘッダー
------------------------------------------------------------*/
header > div{
	background: #e29820;
	padding: 4px 0;
}
h1,#main_area{
	max-width: 1680px;
	width: 90%;
	margin: 0 auto;
}
h1{
	font-size: 12px;
	color: #fff;
}

/* メインエリア
------------------------------------------------------------*/
#main_area{
	width: 90%;
	height: 885px;
	background: url("../images2/main.webp") no-repeat left / cover;
	position: relative;
	margin-top: 50px;
	border-radius: 20px;
}
#main_area::before{
	content: "";
	background: url("../images2/copy.webp") center / contain no-repeat;
	width: 46%;
	height: 160px;
	left: 5%;
	top:43%;
}
.logo,.open-img,#main_area::before{position: absolute;}
.logo{
	z-index: 2;
	left: -1px;
	top:-1px;
	background: #fff;
	padding: 0 15px 18px 0;
	border-radius: 0 0 10px 0;
}
.open-img{
	right: 1%;
	bottom: 0;
	width:28%;
	height: auto;
}

/* コンテンツ
------------------------------------------------------------*/
.content-top{padding-top: 100px;}
.content{padding: 80px 0;}
.inner-box{
	max-width: 1300px;
	width: 90%;
	margin: 0 auto;
}

/* .b-li
------------------------------------------------------------*/
.b-li h2,.b-li h3{
	padding-bottom: 25px;
	margin-bottom: 35px;
	border-bottom: #E6E6E6 2px solid;
}
.b-li h2,.b-li h3,.b-li h2 span{
	font-family:YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	font-weight: bold;
	letter-spacing: .2em;
}
.b-li li > img{
	width: 100%;
	max-width: 500px;
	margin: 0 auto;
	display: block;
	border-radius: 15px;
}

/* .dl-g
------------------------------------------------------------*/
.dl-g > div{
	display: flex;
	flex-wrap: wrap;
}
.dl-g > div:not(:last-child){
	border-bottom: #E6E6E6 1px solid;
	padding-bottom: 15px;
	margin-bottom: 15px;
}
.dl-g > div > dt{
	font-weight: bold;
	font-size: 16px;
	color: #e29820;
	width: 100px;
}
.dl-g  > div > dd{
	font-size: 16px;
	width: calc(100% - 100px);
}

/* タイトル
--------------------------------------------------*/
.title{
	text-align: center;
	margin-bottom: 70px;
}
.title p{margin-bottom: 25px;}
.title h2,.title h2 span{
	font-family:YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	font-weight: bold;
	letter-spacing: .2em;
}
.title h2{font-size: 26px;}
.title span{font-size: 22px;}

/* ABOUT
------------------------------------------------------------*/
.about-wrap > div{width: 54%;}
.about-wrap > img{width: 40%; border-radius: 15px;}

/* フッター
------------------------------------------------------------*/
.access > div:not(:last-child){margin-bottom: 15px;}
.access dt{margin-bottom: 10px;}
.access dt span{
	font-weight: bold;
	background:linear-gradient(transparent 70% , rgba(226,152,32,.3) 70%);
}
.map{height: auto;}
.map iframe{
	width: 100%;
	height: 100%;
	border-radius: 15px;
}
.copy{
	background-color: #e29820;
	text-align: center;
	padding: 23px 0;
	color: #fff;
}

/* 1025px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1025px){
	body {min-width: 980px!important;}
	html::after{width: 5px;}
	
	/* 共通 */

	.mb40{margin-bottom: 20px!important;}
	.mb80{margin-bottom: 60px!important;}
	.fs18,.fs18 *{font-size: 16px!important;}
	.fs20{font-size: 16px!important;}
	.fs26{font-size: 18px!important;}
	.li_mb15 > li:not(:last-child){margin-bottom: 8px;}
	.list > li::before{
		width: 6px;
		height: 6px;
		margin: 5px 8px 0 0;
	}
	
	/* メインエリア
	--------------------------------------*/
	.logo{
		width: 300px;
		padding: 0 10px 15px 0;

	}
	#main_area{
		margin-top: 30px;
		height: 500px;
	}
	#main_area::before{
		width: 60%;
		height: 160px;
		left: 5%;
		top:23%;
	}
	.open-img{
		width:35%;
		height: auto;
	}
	/* コンテンツ
	--------------------------------------*/
	.content-top{padding-top: 100px;}
	.content{padding: 100px 0;}
	
	/* .b-li
	------------------------------------------------------------*/
	.b-li h2,.b-li h3{
		padding-bottom: 15px;
		margin-bottom: 20px;
	}

	/* .dl-g
	------------------------------------------------------------*/
	.dl-g > div:not(:last-child){
		padding-bottom: 12px;
		margin-bottom: 12px;
	}
	.dl-g > div > dt{
		font-size: 16px;
		width: 70px;
	}
	.dl-g  > div > dd{
		font-size: 14px;
		width: calc(100% - 70px);
	}

	/* タイトル
	--------------------------------*/
	.title{margin-bottom: 40px;}
	.title p{margin-bottom: 12px;}
	.title p img{
		width: auto!important;
		height: 40px;
	}
	.title h2{font-size: 18px;}
	.title span{font-size: 14px;}
	
	/* フッター
	--------------------------------------*/
	.copy{
		padding: 15px 0;
		font-size: 12px;
	}
}

/* 750px以下から
------------------------------------------------------------*/
@media only screen and (max-width:750px){
	body {min-width: 700px!important;}
	
	/* 共通 */
	.c2 > *{width: 100%;}
	.c2 > *:not(:last-child){margin-bottom: 30px;}
	.c3 > *{width: 48%;}
	.c3 > li:not(:nth-last-child(-n+2)) {margin-bottom: 30px;}
	/* ABOUT
	--------------------------------------*/
	.about-wrap > img,.about-wrap > div{width: 100%;}
	.about-wrap > img{
		max-width: 450px;
		margin: 0 auto 40px;
	}
	
	/* フッター
	--------------------------------------*/
	.hour{
		max-width: 500px;
		width: 100%;
		margin: 0 auto;
		display: block;
	}
	.map{height: 350px;}
}

/* 500px以下から
------------------------------------------------------------*/
@media only screen and (max-width:500px){
    body {min-width: inherit!important;width: 100%;}
	html::after{content: none;}
	
	/* 共通 */
	.sp_on{display: block;}
	.c3 > *{width: 100%;}
	.c3 > li:not(:last-child) {margin-bottom: 20px;}
	/* メインエリア
	--------------------------------------*/
	.logo{width: 250px;}
	#main_area::before{
		width: 90%;
		height: 160px;
		left: 5%;
		top:23%;
	}
	.open-img{
		bottom:3%;
		width:60%;
		height: auto;
	}
	
	/* .dl-g
	------------------------------------------------------------*/
	.dl-g > div > dt,.dl-g > div > dd{width: 100%!important;}
	.dl-g > div > dt{margin-bottom: 5px;}
	
}