/* flex */
.flex, .flexA, .flexB, .flexC {
	display: flex;
	flex-wrap: wrap;
}
.flexA {
	justify-content: space-around;
}
.flexB {
	justify-content: space-between;
}
.flexC {
	justify-content: center;
}
/*------------------------------------------------------------
	レイアウト
------------------------------------------------------------*/
body {
	width: 100%;
	min-width: 1000px;
	color: #2E0F00;
	font-size: 1.6rem;
	line-height: 2;
	text-size-adjust: none;
	-webkit-text-size-adjust: none;
	background-color: #FFF;
}
#container {
	position: relative;
	text-align: left;
}
#main {
	padding: 0 0 1px 0;
	background-color: #DEC7B5
}
a[href^="tel:"] {
	cursor: default;
	pointer-events: none;
}
@media all and (min-width: 897px) {
	.content {
		width: 1000px;
		margin: 0 auto 2em;
	}
	#section_flex {
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;
	}
	#section_flex > section {
		flex-basis: 490px;
		margin: 1em 0;
	}
	.sp {
		display: none !important;
	}
}
@media all and (max-width: 896px) {
	body {
		min-width: inherit;
		font-size: 1.4rem;
	}
	body.fixed {
		width: 100%;
		height: 100%;
		position: fixed;
		left: 0;
		top: 0;
	}
	a:hover, a:hover img {
		opacity: 1 !important;
	}
	.pc {
		display: none !important;
	}
	a[href^="tel:"] {
		cursor: pointer;
		pointer-events: auto;
	}
}
.align-center {
	text-align: center;
}
.align-right {
	text-align: right;
}
.error_info {
	display: block;
	margin: 0.5rem;
	color: #AF0002;
	line-height: 1.2;
	font-size: 0.8em;
}
.ttl{
	display: block;
	margin: 0.5rem 0 1rem 0;
	padding: 0.5rem;
	color: #fff;
	background: #AF0002;
	font-size: 1.2rem;
}
.line{
	padding: 3px;
	border-bottom: 1px solid #d3a665;
	border-top: 1px solid #d3a665;
	margin-bottom: 1rem;
}
/*------------------------------------------------------------
	button
------------------------------------------------------------*/
.link_button a, .link_button input {
	display: block;
	font-size: 1.6rem;
	font-weight: normal;
	border-radius: 5px;
	background: linear-gradient(to right, #e33232, #a51919);
	padding: 1rem;
	text-align: center;
	color: #fff;
	border: none !important;
}
.link_button a:hover, .link_button input:hover {
	background: linear-gradient(to right, #a51919, #e33232);
}
/*------------------------------------------------------------
	ヘッダー
------------------------------------------------------------*/
#gHeader {
	padding: 7px 0 0;
	width: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 1000;
	box-sizing: border-box;
	background-color: rgba(255, 255, 255, 0.6);
}
#gHeader.fix {
	background: rgba(255, 255, 255, 0.8);
}
#gHeader .hBox {
	margin: 0 auto;
	padding: 0 24px;
	min-width: 1120px;
	max-width: 1392px;
}
#gHeader h1 {
	padding: 18px 0 0 0;
	//	width: 268px;
}
#gHeader h1 a {
	display: inline-block;
	width: 268px;
}
#gHeader h1 span {
	display: inline-block;
	padding: 0 0 0 25px;
	font-size: 26px;
	font-weight: bold;
	letter-spacing: 2px;
}
#gHeader h1 img, #gHeader h1 span {
	vertical-align: bottom;
}
#gHeader .rBox {
	margin: 8px 0 0;
	align-items: flex-start;
	justify-content: flex-end;
	position: relative;
	z-index: 2;
}
#gNavi, .lNavi {
	font-weight: bold;
	font-family: 'Noto Serif JP', serif;
}
#gNavi {
	position: relative;
	align-items: center;
	padding: 0 24px;
	max-width: 1392px;
	margin: -50px auto 0;
	z-index: 1;
}
#gNavi li {
	margin-right: 27px;
	line-height: 1.15;
}
#gNavi li:last-of-type {
	margin-bottom: 0;
}
#gNavi li a {
	padding: 15px 0;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	font-size: 1.4rem;
}
#gNavi .liStyle a {
	padding-right: 22px;
	background: url("https://huntersvillage.jp/wordpress/img/common/icon04.png") no-repeat right top 20px;
	background-size: 12px auto;
}
#gNavi .liStyle a.on {
	background-image: url("https://huntersvillage.jp/wordpress/img/common/icon29.png");
}
#gHeader .linkList {
	width: 180px;
}
#gHeader .linkList li:first-child {
	margin: 8px 0 0;
	padding-bottom: 11px;
	width: 100%;
	position: relative;
	order: 2;
}
#gHeader .linkList li .linkInner {
	padding: 25px 25px 40px;
	width: 267px;
	display: none;
	height: calc(100vh - 90px);
	overflow-y: auto;
	position: absolute;
	left: -20px;
	top: 100%;
	box-sizing: border-box;
	background: url("https://huntersvillage.jp/wordpress/img/common/sub_bg01.jpg") no-repeat center center;
	background-size: cover;
	content: "";
}
@media all and (min-height: 897px) {
	#gHeader .linkList li .linkInner {
		height: 706px;
	}
}
#gHeader .linkInner .txtList {
	margin-bottom: 14px;
	padding-left: 25px;
	background: url("https://huntersvillage.jp/wordpress/img/common/line01.png") repeat-y left top;
	background-size: 7px auto;
}
#gHeader .linkInner .txtList li {
	margin: 0 0 19px;
	width: auto;
}
#gHeader .linkInner .txtList li:last-of-type {
	margin-bottom: 0;
}
#gHeader .linkInner .txtList li a {
	padding: 0;
	display: block;
	font-size: 1.4rem;
	font-weight: 700;
	background: none;
}
@media all and (min-width: 897px) and (max-width: 1279px) {
	#gHeader .rBox {
		width: auto;
	}
}
@media all and (min-width: 897px) {
	#gHeader .linkInner .txtList li a:hover {
		color: #805b27;
	}
	#gHeader .linkList .imgList li a:hover {
		color: #AC0000;
	}
	#gHeader .linkList .imgList li a:hover img {
		opacity: 1;
	}
	#gNavi li a:hover {
		color: #805B27;
	}
}
#gHeader .linkInner a::before, #gHeader .linkInner a::after {
	display: none;
}
#gHeader .linkInner .logoInner {
	margin-bottom: 5px;
	align-items: center;
}
#gHeader .linkInner .log {
	width: 65px;
}
#gHeader .linkInner .logoInner p {
	width: calc(100% - 70px);
	font-size: 1.4rem;
}
#gHeader .linkInner .imgList {
	margin: -10px -5px 0;
	padding-bottom: 0;
}
#gHeader .linkInner .imgList li {
	margin: 10px 0 0;
	width: 48%;
	font-size: 1.2rem;
	text-align: center;
	line-height: 1.33;
	position: relative;
}
#gHeader .linkInner .imgList01 li::before {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	content: "";
}
#gHeader .linkInner .imgList01 li a {
	cursor: default;
	pointer-events: none;
}
#gHeader .linkInner .imgList01 li img {
	opacity: 0.7;
}
@media all and (min-width: 897px) {
	#gHeader .linkInner .imgList01 li a:hover img {
		opacity: 0.7;
	}
	#gHeader .linkInner .imgList01 li a:hover {
		color: #2E0F00;
	}
}
#gHeader .linkInner .imgList li .txt {
	margin-top: 5px;
	display: block;
}
#gHeader .linkList li {
	margin-right: 3px;
	width: 86px;
}
#gHeader .linkList li.noInner .linkInner {
	display: none !important;
}
#gHeader .linkList li:last-child {
	margin-right: 0;
}
#gNavi .liStyle, .lNavi .slide {
	position: relative;
}
.liStyle--noEffect {
	cursor: pointer;
}
#gNavi .liStyle .subBox, .lNavi .slide .subBox {
	padding: 28px 0 26px 20px;
	width: 300px;
	display: none;
	box-sizing: border-box;
	background: url("https://huntersvillage.jp/wordpress/img/common/bg08.png") no-repeat center center;
	background-size: cover;
}
#gNavi .liStyle .subList01, .lNavi .slide .subList01 {
	padding-left: 25px;
	background: url("https://huntersvillage.jp/wordpress/img/common/line01.png") repeat-y left top;
	background-size: 7px auto;
}
#gNavi .liStyle .subBox {
	position: absolute;
	left: 0;
	top: 100%;
}
#gNavi .liStyle .liStyle .subBox, .lNavi .slide .subBox {
	position: absolute;
	left: 110%;
	top: 0;
}
#gNavi .liStyle .liStyle .subBox li, .lNavi .slide .subBox li {
	padding: 0 0 0.5em;
	border-radius: 0 !important;
}
#gNavi .liStyle .liStyle .subBox p, .lNavi .slide .subBox p {
	padding: 0.5em 0 0.5em 1em;
}
#gNavi .liStyle .subList01 li {
	margin: 0 0 16px;
}
#gNavi .liStyle .subList01 li:last-of-type {
	margin-bottom: 0;
}
#gNavi .liStyle .subList01 li a {
	padding: 0;
	min-height: inherit;
	background: none;
}
#gNavi .liStyle .subList02 {
	margin-left: -77px;
	width: 153px;
	padding: 18px;
	display: none;
	position: absolute;
	left: 50%;
	top: 100%;
	box-sizing: border-box;
	background: url("https://huntersvillage.jp/wordpress/img/common/bg08.png") no-repeat center center;
	background-size: cover;
}
#gNavi .liStyle .subList02 li {
	margin: 0 0 8px;
}
#gNavi .liStyle .subList02 li:last-of-type {
	margin-bottom: 0;
}
#gNavi .liStyle .subList02 li a {
	padding: 0;
	position: relative;
	overflow: hidden;
	min-height: inherit;
	background: none;
}
.lNavi {
	padding: 10px 10px;
	width: 66px;
	position: absolute;
	left: 0;
	top: 127px;
	box-sizing: border-box;
	background: #2E0F00;
}
.lNavi li {
	margin-bottom: 6px;
}
.lNavi li:last-of-type {
	margin-bottom: 0;
}
.lNavi li a {
	display: block;
}
p.double_bn a {
	display: inline-block !important;
	box-sizing: border-box !important;
	width: 49% !important;
	padding: 0 5px !important;
}
/* @media all and (min-width: 897px) and (max-width: 1279px) {
    #gHeader {
        padding-bottom: 5px;
    }
    #gNavi {
        display: none;
    }
    #gHeader .rBox {
        justify-content: flex-end;
    }
} */
@media all and (min-width: 897px) {
	#gHeader .linkList li a {
		position: relative;
		display: block;
		overflow: hidden;
	}
	#gHeader .linkList li a::before {
		margin: -3px -6px 0 0;
		width: 12px;
		height: 6px;
		position: absolute;
		top: 38px;
		right: 50%;
		content: '';
		background: url("https://huntersvillage.jp/wordpress/img/common/icon08.png") no-repeat right center;
		background-size: cover;
	}
	#gHeader .linkList li:first-of-type a::before {
		margin: -3px 0 0;
		width: 12px;
		height: 6px;
		position: absolute;
		top: 50%;
		right: .5em;
		content: '';
		background: url("https://huntersvillage.jp/wordpress/img/common/icon11.png") no-repeat right center;
		background-size: cover;
	}
	#gHeader .linkList li a::after {
		content: "";
		position: absolute;
		height: 250px;
		width: 100px;
		background-color: #fff;
		opacity: 0.2;
		transform: rotate(35deg);
		top: -80px;
		left: -140px;
		transition: 0.3s;
	}
	#gHeader .linkList li a:hover::after {
		left: 120%;
	}
	.lNavi li a {
		position: relative;
		overflow: hidden;
	}
	.lNavi li a::after {
		content: "";
		position: absolute;
		height: 250px;
		width: 100px;
		background-color: #fff;
		opacity: 0.2;
		transform: rotate(35deg);
		top: -80px;
		left: -140px;
		transition: 0.3s;
	}
	.lNavi li a:hover::after {
		left: 120%;
	}
	.lNavi li:last-of-type {
		border-radius: 50%;
		overflow: hidden;
	}
	#gNavi .liStyle .subList01 li a:hover {
		color: #805B27;
	}
	#gNavi .liStyle .subList02 li a::after {
		content: "";
		position: absolute;
		height: 250px;
		width: 100px;
		background-color: #fff;
		opacity: 0.2;
		transform: rotate(35deg);
		top: -80px;
		left: -140px;
		transition: 0.3s;
	}
	#gNavi .liStyle .subList02 li a:hover::after {
		left: 120%;
	}
}
@keyframes arrowbefore {
	100% {
		right: -.4em;
		opacity: 0;
	}
}
@keyframes arrowafter {
	99% {
		right: .5em;
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}
@media all and (min-width: 897px) {
	#gHeader .menuBox {
		display: none !important;
	}
}
@media all and (max-width: 896px) {
	#gHeader {
		padding: 12px 15px;
		background: none;
	}
	#gHeader .hBox {
		margin: 0 auto;
		padding: 0;
		min-width: inherit;
		max-width: inherit;
		align-items: flex-end;
	}
	#gHeader .search {
		width: 42px;
	}
	#gHeader h1 {
		padding: 0;
	}
	#gHeader h1 a {
		display: block;
		width: 200px;
	}
	#gHeader h1 span {
		display: block;
		padding: 0;
		font-size: 1.2rem;
		margin: 0.5em auto 0;
		font-weight: bold;
		text-align: center;
		letter-spacing: 2px;
	}
	#gHeader h1 img, #gHeader h1 span {
		vertical-align: top;
	}
	#gHeader .rBox {
		display: none;
	}
	#gHeader .menu {
		width: 33px;
	}
	.lNavi {
		display: none;
	}
	#gHeader .menuBox {
		padding: 16px 15px;
		width: 85%;
		height: 100vh;
		display: none;
		overflow-y: auto;
		position: fixed;
		right: 0;
		top: 0;
		box-sizing: border-box;
		background: #DEC7B5;
	}
	#gHeader .menuBox .closeBox {
		margin-bottom: 23px;
		align-items: center;
	}
	#gHeader .menuBox .comLink {
		width: 83%;
	}
	#gHeader .menuBox .close {
		width: 33px;
	}
	#gHeader .menuBox .navi {
		margin: 0 0 20px 5px;
	}
	#gHeader .menuBox .navi li {
		margin-bottom: 22px;
	}
	#gHeader .menuBox .navi li:last-of-type {
		margin-bottom: 0;
	}
	#gHeader .menuBox .navi li a {
		padding-left: 20px;
		font-size: 1.6rem;
		display: block;
		font-weight: 700;
		background: url("../img/common/icon28.png") no-repeat left center;
		background-size: auto 8px;
	}
	#gHeader .menuBox .navi li a.on {
		background: url("../img/common/icon27.png") no-repeat left center;
		background-size: 8px auto;		
	}
	#gHeader .menuBox .navi li a img {
		margin-left: 10px;
		width: 17px;
		display: inline-block;
		vertical-align: middle;
	}
	#gHeader .menuBox .subSec {
		display: none;
		margin: -30px -15px -15px -20px;
		padding: 42px 20px 15px;
		//		background: url("https://huntersvillage.jp/wordpress/img/common/sp_bg02.png") no-repeat center center;
		//		background-size: cover;
	}
	#gHeader .menuBox .subNavi {
		background: url("https://huntersvillage.jp/wordpress/img/common/line01.png") repeat-y left top;
		background-size: 7px auto;
	}
	#gHeader .menuBox .subNavi li {
		margin-bottom: 11px;
	}
	#gHeader .menuBox .subNavi li:last-of-type {
		margin-bottom: 0;
	}
	#gHeader .menuBox .subNavi li a {
		padding-left: 25px;
		background: none;
		font-size: 1.4rem;
	}
	#gHeader .menuBox .linkBox {
		padding: 25px 0 80px;
		background: url("https://huntersvillage.jp/wordpress/img/common/sp_bg03.png") no-repeat center top;
		background-size: 100% auto;
	}
	#gHeader .menuBox .linkBox--short {
		padding: 25px 0 0;
	}
	#gHeader .menuBox .link {
		margin-bottom: 15px;
	}
	#gHeader .menuBox .link a {
		padding-left: 20px;
		font-size: 1.6rem;
		display: block;
		font-weight: 700;
		background: url("https://huntersvillage.jp/wordpress/img/common/icon27.png") no-repeat left center;
		background-size: 8px auto;
	}
	#gHeader .menuBox .linkBox .comLink {
		width: auto;
	}
	#gHeader .menuBox .linkBox .comLink li {
		width: 49.5%;
	}
	#gHeader .menuBox .linkBox .comLink li:last-of-type a .inn {
		background: -webkit-linear-gradient(left, #b57048, #4a1900);
		background: -o-linear-gradient(right, #b57048, #4a1900);
		background: -moz-linear-gradient(right, #b57048, #4a1900);
		background: linear-gradient(to right, #b57048, #4a1900);
	}
	#gHeader .menuBox .navi .liStyle01 a {
		background-image: url("https://huntersvillage.jp/wordpress/img/common/icon04.png");
		background-size: 12px auto;
	}
	#gHeader .menuBox .navi .imgList {
		margin: 15px -15px;
		padding: 20px;
		background: #f1e9e1;
		border: 1px solid #d6a867;
	}
	#gHeader .menuBox .navi .imgList li {
		width: 43%;
		position: relative;
	}
	#gHeader .menuBox .navi .imgList01 li::before {
		width: 100%;
		height: 100%;
		position: absolute;
		left: 0;
		top: 0;
		content: "";
	}
	#gHeader .menuBox .navi .imgList li a {
		padding: 0;
		text-align: center;
		background: none;
	}
	#gHeader .menuBox .navi .imgList01 li a {
		cursor: default;
		pointer-events: none;
	}
	#gHeader .menuBox .navi .imgList li .img {
		display: block;
	}
	#gHeader .menuBox .navi .imgList01 li .img {
		opacity: 0.6;
	}
	#gHeader .menuBox .navi .imgList li .img img {
		margin: 0;
		width: auto;
	}
	#gHeader .menuBox .navi .imgList li .txt {
		display: block;
		font-size: 1.2rem;
		font-weight: 700;
		font-family: 'Noto Sans JP', sans-serif;
	}
	#gNavi {
		display: none;
	}
}
@media all and (max-width: 420px) {
	#gHeader .search {
		width: 30px;
	}
	#gHeader h1 {
		width: 200px;
	}
}
/*------------------------------------------------------------
	フッター
------------------------------------------------------------*/
#gFooter .fBox {
	padding: 70px 100px 20px;
	box-sizing: border-box;
	background: url("https://huntersvillage.jp/wordpress/img/common/f_bg2.jpg") no-repeat center center;
	background-size: cover;
	display: flex;
}
#gFooter .fLogo {
	margin: 0 auto 15px;
	width: 319px;
}
#gFooter .fLogo > p {
	display: flex;
	justify-content: space-around;
	padding: 20px 0px
}
#gFooter .fNavi {
	width: 60%;
	justify-content: space-between;
}
#gFooter .fNavi li {
	margin: 0 25px;
}
#gFooter .fNavi li a {
	padding-left: 15px;
	color: #FFF;
	display: block;
	font-weight: 700;
	background: url("https://huntersvillage.jp/wordpress/img/common/icon13.png") no-repeat left center;
	background-size: 8px auto;
}
#gFooter .fNavi li a:hover {
	opacity: 0.7;
}
#gFooter .copyright {
	padding: 8px 0;
	color: #FFF;
	font-size: 1rem;
	font-weight: 500;
	text-align: center;
	background-color: #2f0f00;
}
.privacyM {
	display: inline-block;
	width: 60px;
	height: 60px;
	background: #fff;
	padding: 6px;
	border-radius: 5px;
	box-sizing: border-box;
}
.btn-social-circle {
	display: inline-block;
	position: relative;
	box-sizing: border-box;
	text-decoration: none;
	color: #FFF !important;
	width: 60px;
	height: 60px;
	line-height: 40px;
	padding: 5px;
	font-size: 30px;
	border-radius: 50%;
	text-align: center;
	font-weight: bold;
	box-shadow: inset 0 2px 0px rgba(255, 255, 255, 0.25), inset 0 -2px 0px rgba(0, 0, 0, 0.18);
	transition: .2s;
}
.btn-social-circle .fab {
	font-size: 30px;
	line-height: 30px;
}
.btn-social-circle:hover {
	box-shadow: none;
}
.btn-social-circle--twitter {
	background: #1da1f3;
	border: solid 5px #1da1f3;
}
.btn-social-circle--facebook {
	background: #3b75d4;
	border: solid 5px #3b75d4;
}
.btn-social-circle--insta {
	background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
	border: solid 5px #ec40f5;
}
.btn-social-circle--feedly {
	background: #7ece46;
	border: solid 5px #7ece46;
}
@media all and (min-width: 897px) and (max-width: 1279px) {
	#container {
		padding-bottom: 270px;
	}
	#gFooter {
		width: 100vw;
		position: absolute;
		left: 0;
		bottom: 0;
	}
	#gFooter .fBox {
		padding: 50px 10px 20px 100px;
	}
	#gFooter .fNavi {
		width: 100%;
		justify-content: flex-start;
		padding: 10px 0 0 20px;
	}
	#gFooter .fNavi li {
		margin: 0 30px 0 0;
	}
}
@media all and (max-width: 896px) {
	#gFooter {
		width: auto;
	}
	#gFooter .pageTop {
		width: 74px;
		position: fixed;
		right: 10px;
		bottom: 10px;
		z-index: 100;
	}
	#gFooter .fBox {
		padding: 36px 15px;
		width: auto;
		background-image: url("https://huntersvillage.jp/wordpress/img/common/sp_f_bg2.jpg");
		display: block;
	}
	#gFooter .fLogo {
		margin: 0 auto 18px;
	}
	#gFooter .fNavi {
		display: block;
		width: 100%;
		padding: 30px 0 0 0;
	}
	#gFooter .fNavi li {
		margin: 0 0 10px;
	}
	#gFooter .fNavi li:last-of-type {
		margin-bottom: 0;
	}
	#gFooter .copyright {
		padding: 10px 0;
		width: auto;
	}
}
@media all and (max-width: 420px) {
	#gFooter .fLogo {
		width: 280px;
	}
}

/*------------------------------------------------------------
	pageLead
------------------------------------------------------------*/
.pageLead {
	padding: 180px 0 24px;
	text-align: center;
	background: url("https://huntersvillage.jp/wordpress/img/about/page_title_bg.jpg") no-repeat top center / cover;
}

@media all and (max-width: 896px) {
	.pageLead {
		padding: 88px 0 0;
		background-image: url("https://huntersvillage.jp/wordpress/img/common/sp_page_lead_bg.jpg");
		background-position: center center;
	}
}
/*------------------------------------------------------------
	pagePath
------------------------------------------------------------*/
#pagePath {
	padding: 5px 15px;
	background: none;
	text-align: left;
}
#pagePath li {
	display: inline-block;
	font-size: 1rem;
}
#pagePath li a {
	padding-right: 3px;
	display: inline-block;
	font-size: 1rem;
}
@media all and (max-width: 896px) {}
/*------------------------------------------------------------
	navi
------------------------------------------------------------*/
#mypage_nav ul {
	display: flex;
	background: #fff;
	border-top: 1px solid #9e826c;
	border-bottom: 1px solid #9e826c;
	background-image: linear-gradient(180deg, rgba(255, 255, 255, 1) 50%, rgba(215, 215, 215, 1));
}
#mypage_nav ul li {
	width: calc(100%/6);
	text-align: center;
	padding: 1rem 0;
	border-right: 1px solid #9e826c;
	background-image: linear-gradient(180deg, rgba(255, 255, 255, 1) 50%, rgba(215, 215, 215, 1));
}
#mypage_nav ul li:hover {
	background-image: linear-gradient(180deg, rgba(215, 215, 215, 1) 50%, rgba(255, 255, 255, 1));
}
#mypage_nav ul li:last-child {
	border: none;
}
#mypage_nav ul li a {
	font-size: 1rem;
	position: relative;
	display: block;
}
#mypage_nav ul li a:before {
	font-family: "Font Awesome 5 Free";
	color: #e8b48b;
	font-weight: bold;
	font-size: 2rem;
	line-height: 2rem;
	display: block;
	position: relative;
	padding: 0.5rem 0 0.2rem;
	text-align: center;
}
#mypage_nav ul li a:hover:before {
	color: #ff8c7a
}
#mypage_nav ul li:nth-child(1) a:before {
	content: "\f015"; /*home*/
}
#mypage_nav ul li:nth-child(2) a:before {
	content: "\f521"; /*クエスト*/
}
#mypage_nav ul li:nth-child(3) a:before {
	content: "\f0f3"; /*発見報告*/
}
#mypage_nav ul li:nth-child(4) a:before {
	content: "\f5ad"; /*レポート*/
}
#mypage_nav ul li:nth-child(5) a:before {
	content: "\f03d"; /*動画*/
}
#mypage_nav ul li:nth-child(6) a:before {
	content: "\f013"; /*設定*/
}
@media all and (min-width: 897px) {
	#mypage_nav ul {
		justify-content: center;
	}
	#mypage_nav ul li {
		flex-basis: 166px;
	}
	#mypage_nav ul li:first-child {
		border-left: 1px solid #9e826c
	}
	#mypage_nav ul li:last-child {
		border-right: 1px solid #9e826c;
	}
}


/*------------------------------------------------------------
	wp-pagenavi
------------------------------------------------------------*/
.wp-pagenavi {
	font-size: 0;
	clear: both;
	text-align: center;
	padding: 0 0 20px 0;
}
.wp-pagenavi img {
	display: inline-block;
	width: 11px;
	vertical-align: middle;
}
.wp-pagenavi a, .wp-pagenavi span {
	width: 30px;
	height: 30px;
	font-size: 1rem;
	display: inline-block;
	text-decoration: none;
	border-radius: 50%;
	padding: 5px 5px 0;
	margin: 0 5px;
	font-weight: bold;
	box-sizing: border-box;
	background-color: #fff5eb;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
	background-color: #d3a663;
}
.wp-pagenavi .first, .wp-pagenavi .last, .wp-pagenavi .pages {
	display: none;
}
.wp-pagenavi .previouspostslink, .wp-pagenavi .nextpostslink {
	width: auto;
	background: none;
}
.wp-pagenavi .extend {
	width: auto;
	background: none;
}
@media all and (min-width: 896px) {
.wp-pagenavi a, .wp-pagenavi span {
	width: 44px;
	height: 44px;
	font-size: 1.4rem;
	padding: 10px 5px 0;
	margin: 0 8px;
}

}

@media all and (max-width: 896px) {
	.wp-pagenavi {
//		margin: 0 -15px;
	}
}


/*------------------------------------------------------------
content
------------------------------------------------------------*/
.content {
	padding-bottom: 1px;
	position: relative;
}
.content section {
	background: #fff;
	margin: 2rem;
	padding: 2rem;
	border-radius: 10px;
	line-height: 2;
	letter-spacing: 1px;
}
.content section h1 {
	padding: 0 0 1rem 0;
}
.content section h1, .content section h1 p {
	font-size: 2rem;
}
.content .small {
	font-size: 1rem
}
/*------------------------------------------------------------
#profile_area
------------------------------------------------------------*/
#profile_area {
	position: relative;
}
#profile_area h1 {
	padding: 0 0 1rem 0;
	text-align: center;
}
#profile_area div.flex {
	justify-content: center;
}
p.level {
	display: inline-block;
	padding: 0 1rem;
}
.icon {
	position: relative;
	width: 10rem;
	height: 10rem;
	max-width: 200px;
	max-height: 200px;
}
.icon .pho{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
}

.icon .pho img{
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
}

.icon .frame {
	position: absolute;
	z-index: 10;
}
.icon .my_icon img {
	padding: 1.5rem;
	border-radius: 50%;
	width: 10rem;
	height: 10rem;
	object-fit: cover;
}
ul.degree {
	display: inline-block;
	padding: 1rem 0 0 2rem;
}
ul.degree li {
	font-size: 1.4rem;
	margin: 0;
}
ul.plan li {
	font-size: 0.9rem;
	letter-spacing: normal;
	text-align: right;
}
ul.plan li a {
	font-size: 1rem;
	letter-spacing: 1px;
	border-radius: 10px;
	background: linear-gradient(to right, #b57048, #4a1900);
	padding: 0.3rem 2rem;
	color: #fff;
}
ul.plan li a:hover {
	background: linear-gradient(to right, #4a1900, #b57048);
}
#profile_area dl.flex {
	border: 1px solid #9e826c;
}
#profile_area dl.flex dt {
	font-size: 1rem;
	min-width: 9em;
	padding: 0.5em;
	margin: -1px 0 0 0;
	text-align: center;
	flex-basis: 9em;
	border-top: 1px solid #9e826c;
}
#profile_area dl.flex dd {
	font-size: 1rem;
	border-top: 1px solid #9e826c;
	border-left: 1px solid #9e826c;
	padding: 0.5em;
	margin: -1px 0 0 0;
	flex-basis: calc(100% - 9em);
}
@media all and (min-width: 420px) {
	#profile_area h1 {
		text-align: left;
	}
	#profile_area div.flex {
		justify-content: flex-start;
	}
	.icon {
		position: relative;
		width: 15rem;
		height: 15rem;
	}
	.icon .my_icon img {
		width: 15rem;
		height: 15rem;
	}
	ul.degree li {
		font-size: 1.6rem;
		margin: 0;
	}
	#profile_area {
		position: relative;
	}
	ul.plan {
		position: absolute;
		right: 20px;
		bottom: 20px;
	}
	ul.plan li {
		font-size: 0.9rem;
		letter-spacing: normal;
		text-align: right;
	}

#profile_area dl.flex dt {
	font-size: 1.4rem;
}
#profile_area dl.flex dd {
	font-size: 1.4rem;
	padding: 0.5em;
	margin: -1px 0 0 0;
}
}
@media all and (min-width: 897px) {
	#profile_area div.flex {
		justify-content: center;
		align-items: center;
		margin: 3rem 0 0 0;
	}
	.icon {
		position: relative;
		width: 200px;
		height: 200px;
	}
	.icon .my_icon img {
		padding: 15px;
		border-radius: 50%;
		width: 200px;
		height: 200px;
		object-fit: cover;
	}
}
/*------------------------------------------------------------
top
#ability_point_area
------------------------------------------------------------*/
section h1 .more, section h3 .more, section dt .more {
	display: inline-block;
	border: #666 solid 1px;
	border-radius: 50%;
	color: #666;
	font-size: 0.8rem;
	line-height: 1.6rem;
	width: 1.6rem;
	text-align: center;
	margin: 0 0 0 1rem;
}
section h1 .hint, section h3 .hint, section dt .hint {
	display: none;
	border: #666 solid 1px;
	border-radius: 5px;
	color: #666;
	font-size: 1rem !important;
	font-weight: normal;
	padding: 0.5rem;
	margin: 0 0 0.5rem 0;

}
#ability_point_area .flex {
	flex-wrap: wrap;
	justify-content: space-between;
}
.ability_list, .ability_list02 {
	flex-basis: calc( calc(100% - 0.5rem) / 2);
	border-radius: 5px;
	padding: 0.5rem;
	margin: 0 0 0.5rem 0;
}
.ability_list {
	background: #fff5eb;
}
.ability_list:nth-last-of-type(2),
.ability_list02 {
	flex-basis: 100%;
}
.ability_list dt {
	font-size: 1.4rem;
}
.ability_list dt span {
	display: inline-block;
	margin: 0 0.5rem 0 0;
}
.inspiration {
	color: #ffd045;
}
.intelligence {
	color: #8ee083;
}
.physical {
	color: #ff757e;
}
.investigative {
	color: #d397fa;
}
.skill {
	color: #83fefb;
}
.ex {
	color: #0066cc;
}
.total {
	color: #b30000;
}
.ability_list dd {
	text-align: right;
	font-size: 2.6rem;
	font-weight: bold;
}
.ability_list dd .small {
	font-weight: normal;
	font-size: 1.4rem;
}
.ability_list02 .small {
	display: block;
	color: #b30000;
}


@media all and (min-width: 420px) {

.ability_list {
	flex-basis: 32%;
}
.ability_list {
	background: #fff5eb;
	flex-grow: 0;
}

}
/*------------------------------------------------------------
	#top
	hunter_point_area
------------------------------------------------------------*/
#hunter_point_area .point {
	background: url("../img/common/img09.png") left bottom no-repeat;
	background-size: contain;
	padding: 0 0 1rem 10rem;
	margin: 0 0 1rem 0;
	border-bottom: 1px dotted #2E0F00;
}
#hunter_point_area .point p {
	font-size: 5rem;
	line-height: 1.1;
	font-weight: bold;
	letter-spacing: 2px;
}
#hunter_point_area .point p .small {
	font-size: 1.6rem;
}
#hunter_point_area .point p.less {
	font-size: 1rem;
	font-weight: normal;
	margin: 0.5rem 0 0 0;
}
/*------------------------------------------------------------
	#top
	ranking_area
------------------------------------------------------------*/
#ranking_area .flex {
	flex-flow: column nowrap;
	justify-content: space-between;
}
#ranking_area .flex > div {
	background: #fff5eb;
	padding: 1rem;
	margin: 0 0 1rem 0;
	border-radius: 5px;
}
#ranking_area .flex > div > p {
	font-weight: bold;
	text-align: center;
	padding: 0 0 1rem 0;
	margin: 0 0 1rem 0;
	border-bottom: 1px dotted #2E0F00;
}
#ranking_area .flex > div > div p {
	font-weight: bold;
	font-size: 3rem;
	line-height: 1;
	text-align: right;
}
#ranking_area .small {
	font-weight: normal;
	font-size: 1rem;
}
#ranking_area .flex img {
	display: inline-block;
	margin: 0 1rem 0 0;
	width: 3rem;
	height: auto;
}
#ranking_area .flex .link_button {
	display: block;
	margin: 1rem 0 0 0;
}
@media all and (min-width: 420px) {
	#ranking_area .flex {
	flex-flow: row nowrap;
	}
	#ranking_area .flex > div {
	flex-basis: 49%;
	background: #fff5eb;
	padding: 1rem;
	border-radius: 5px;
}
}
/*------------------------------------------------------------
	#top
    news_area
------------------------------------------------------------*/
.news_area h1 {
	border-bottom: 1px dotted #2E0F00;
	margin: 0 0 1rem 0;
}
.news_area li {
	padding: 0 0 1rem 0;
	margin: 0 0 1rem 0;
	border-bottom: 1px dotted #2E0F00;
}
.news_area li:first-line {
	font-weight: bold;
}
.news_area li a{
	display: block;
	font-weight: normal;
}

/*------------------------------------------------------------
	フレーム 称号　アイテム　ギルドクーポン　動画
------------------------------------------------------------*/
#setting_text_area{
	font-size: 1rem;
}

#frame_area h2, #setting_frame_area h2, #setting_icon_area h2, #setting_card_area h2, #setting_degree_area h2, #guild_coupon_area h2, #pickup_movie_area h2, #archive_movie_area h2 {
	display: block;
	text-align: center;
	padding: 0.5rem 0;
	font-size: 2rem;
	line-height: 1.2;
}
#frame_area h3, #setting_frame_area h3, #setting_card_area h3, #setting_degree_area h3 {
	font-size: 1.6rem;
	line-height: 1.2;
}
#frame_area h3:first-letter, #setting_frame_area h3:first-letter, #setting_card_area h3:first-letter, #setting_degree_area h3:first-letter {
	font-size: 1.8em;
	color: #ed9b4a;
}
#frame_area h3 span, #setting_frame_area h3 span, #setting_card_area h3 span, #setting_degree_area h3 span {
	display: block;
	font-size: 1rem;
	font-weight: normal;
}
#frame_area > ul, #setting_frame_area > ul, #setting_card_area > ul, #setting_degree_area > ul, #pickup_movie_area > ul, #archive_movie_area > ul, #guild_coupon_area > ul {
	display: flex;
	flex-flow: row wrap;
	margin: 1rem auto;
	padding: 1rem 0;
	border-top: 1px dotted #2E0F00;
	border-bottom: 1px dotted #2E0F00;
}

#setting_degree_area > ul, #pickup_movie_area > ul,
#setting_item_area > ul, #archive_movie_area > ul, #guild_coupon_area > ul {
	flex-flow: column nowrap;
}
#frame_area > ul li, #setting_frame_area > ul li, #setting_card_area > ul li{
	flex-basis: calc(100%/2);
	padding: 0.5rem;
}
#guild_coupon_area > ul li, #setting_item_area > ul li {
	flex-basis: 100%;
	padding: 0.5rem;
}
#setting_degree_area > ul li, #pickup_movie_area > ul li, #archive_movie_area > ul li {
	flex-basis: 100%;
	padding: 0.5rem;
	margin-bottom: 0.5rem;
	border: 1px dotted #ccc;
}
#setting_item_area > ul p:first-child{
	max-width: 200px;
	height: auto;
	margin: 0 auto 0.5rem;;
}
#frame_area > ul p, #setting_frame_area > ul p, #setting_card_area > ul p + p, #setting_item_area > ul p + p, #guild_coupon_area > ul p, #pickup_movie_area > ul p + p, #archive_movie_area > ul p + p {
	font-weight: bold;
	font-size: 1.2rem;
	line-height: 1.2;
	padding:0.5rem 0;
}
#frame_area > ul dt, #frame_area > ul dd,
#setting_frame_area > ul dt, #setting_frame_area > ul dd,
#setting_card_area > ul dt, #setting_card_area > ul dd,
#setting_degree_area > ul dt, #setting_degree_area > ul dd,
#setting_item_area > ul dt, #setting_item_area > ul dd,
#guild_coupon_area > ul dt, #guild_coupon_area > ul dd,
#pickup_movie_area > ul dt, #pickup_movie_area > ul dd, 
#archive_movie_area > ul dt, #archive_movie_area > ul dd{
	font-size: 1.2rem;
	letter-spacing: normal;
}

#setting_card_area > ul dl + p,
#setting_degree_area > ul dl + p,
#setting_item_area > ul dl + p,
#setting_item_area > ul span,
#pickup_movie_area > ul dl + p, #archive_movie_area > ul dl + p{
	display: inline-block;
	font-size: 1.2rem;
	line-height: 1.5;
	letter-spacing: normal;
}

#frame_area > ul dt:first-child, #setting_frame_area > ul dt:first-child, #setting_card_area > ul dt:first-child, #setting_degree_area > ul dt, #setting_item_area > ul dt, #guild_coupon_area > ul dt, #pickup_movie_area > ul dt, #archive_movie_area > ul dt {
	float: left;
	clear: left;
	min-width: 3.5em;
}
#frame_area > ul dt, #setting_frame_area > ul dt, #setting_card_area > ul dt, #setting_degree_area > ul dt, #setting_item_area > ul dt, #guild_coupon_area > ul dt, #pickup_movie_area > ul dt, #archive_movie_area > ul dt {
	font-weight: bold;
	padding: 0 0.5em 0 0;
	min-width: 4.5em;
}
#setting_degree_area + .float_button {
	position: fixed;
	bottom: 1rem;
	right: 1rem;
	z-index: 100;
}
#setting_degree_area + .float_button input {
	padding: 1rem 3rem;
	min-width: 15rem;
	margin: 0 0 0.5rem 0;
}


@media all and (min-width: 420px) {
	#setting_text_area{
	font-size: 1.2rem;
}

	#frame_area h2, #setting_frame_area h2, #setting_icon_area h2, #setting_card_area h2, #setting_degree_area h2, #guild_coupon_area h2, #pickup_movie_area h2, #archive_movie_area h2 {
		position: relative;
		padding: 0 55px;
		font-size: 2rem;
	}
	#frame_area h2:before, #frame_area h2:after, #setting_frame_area h2:before, #setting_frame_area h2:after, #setting_icon_area h2:before, #setting_icon_area h2:after, #setting_card_area h2:before, #setting_card_area h2:after, #setting_degree_area h2:before, #setting_degree_area h2:after, #guild_coupon_area h2:before, #guild_coupon_area h2:after, #pickup_movie_area h2:before, #pickup_movie_area h2:after, #archive_movie_area h2:before, #archive_movie_area h2:after {
		content: '';
		position: absolute;
		top: 50%;
		display: inline-block;
		width: 30px;
		height: 1px;
		background-color: black;
	}
	#frame_area h2:before, #setting_frame_area h2:before, #setting_icon_area h2:before, #setting_card_area h2:before, #setting_degree_area h2:before, #guild_coupon_area h2:before, #pickup_movie_area h2:before, #archive_movie_area h2:before {
		left: 50%;
		margin: 0 0 0 -5.5em;
	}
	#frame_area h2:after, #setting_frame_area h2:after, #setting_icon_area h2:after, #setting_card_area h2:after, #setting_degree_area h2:after, #guild_coupon_area h2:after, #pickup_movie_area h2:after, #archive_movie_area h2:after {
		right: 50%;
		margin: 0 -5.5em 0 0;
	}
	
	#frame_area h3, #setting_frame_area h3, #setting_card_area h3, #setting_degree_area h3 {
		font-size: 1.6rem;
		line-height: 1.5;
	}
	#frame_area h3:first-letter, #setting_frame_area h3:first-letter, #setting_card_area h3:first-letter, #setting_degree_area h3:first-letter {
		font-size: 1.8em;
	}
	#frame_area h3 span, #setting_frame_area h3 span, #setting_card_area h3 span, #setting_degree_area h3 span {
		font-size: 1.2rem;
	}
	#frame_area > ul, #setting_frame_area > ul, #setting_card_area > ul, #setting_item_area > ul, #guild_coupon_area > ul, #setting_degree_area > ul, #pickup_movie_area > ul, #archive_movie_area > ul {
		margin: 2rem auto;
		padding: 2rem 0;
		border-top: 1px dotted #2E0F00;
		border-bottom: 1px dotted #2E0F00;
	}
	#guild_coupon_area > ul, #setting_item_area > ul{
		flex-flow: row wrap;
	}
	#frame_area > ul li, #setting_frame_area > ul li, #setting_card_area > ul li, #setting_item_area > ul li,
	#guild_coupon_area > ul li{
		flex-basis: calc(100%/2);
		padding: 1rem;
	}

	#setting_degree_area > ul li, #pickup_movie_area > ul li, #archive_movie_area > ul li {
		padding: 1rem;
		margin-bottom: 1rem;
		border: 1px dotted #ccc;
	}
	#frame_area > ul li, #setting_frame_area > ul li{
		flex-basis: calc(100%/3);
	}
	#pickup_movie_area > ul, #archive_movie_area > ul {
		flex-flow: row wrap;
	}
	#pickup_movie_area > ul li, #archive_movie_area > ul li {
		margin: 1rem;
		flex-basis: calc(calc(100% - 4rem) / 2);
	}
	#frame_area > ul p, #setting_frame_area > ul p, #setting_card_area > ul p + p, #setting_item_area > ul p + p, #guild_coupon_area > ul p, #pickup_movie_area > ul p + p, #archive_movie_area > ul p + p {
	font-size: 1.4rem;
}
}

@media all and (min-width: 897px) {
	
	#frame_area h2, #setting_frame_area h2, #setting_icon_area h2, #setting_card_area h2, #setting_degree_area h2, #guild_coupon_area h2, #pickup_movie_area h2, #archive_movie_area h2 {
		font-size: 3rem;
	}
	#frame_area h2:before, #frame_area h2:after, #setting_frame_area h2:before, #setting_frame_area h2:after, #setting_icon_area h2:before, #setting_icon_area h2:after, #setting_card_area h2:before, #setting_card_area h2:after, #setting_degree_area h2:before, #setting_degree_area h2:after, #guild_coupon_area h2:before, #guild_coupon_area h2:after, #pickup_movie_area h2:before, #pickup_movie_area h2:after, #archive_movie_area h2:before, #archive_movie_area h2:after {
		width: 45px;
	}
	#frame_area h3, #setting_frame_area h3, #setting_card_area h3, #setting_degree_area h3 {
		font-size: 1.8rem;
	}
	#frame_area h3:first-letter, #setting_frame_area h3:first-letter, #setting_card_area h3:first-letter, #setting_degree_area h3:first-letter {
		font-size: 2em;
	}
	
	#setting_degree_area > ul {
		flex-flow: row wrap;
	}
	#frame_area > ul li, #setting_frame_area > ul li {
		flex-basis: calc(100%/5);
	}
	#pickup_movie_area > ul, #archive_movie_area > ul {
		flex-basis: calc(100%/2);
	}
	#setting_card_area > ul li, #setting_item_area > ul li, #pickup_movie_area > ul li, #archive_movie_area > ul li, #guild_coupon_area > ul li {
		flex-basis: calc(100%/4);
	}
	#setting_degree_area > ul li, #pickup_movie_area > ul li, #archive_movie_area > ul li {
		margin: 1rem;
		flex-basis: calc(calc(100% - 6rem) / 3);
	}
	
	#setting_degree_area + .float_button {
		display: flex;
		justify-content: center;
		width: 100%;
		}
#setting_degree_area + .float_button input {
	margin: 0 0 0 0.5rem;
}
	
}

#guild_coupon_area .more{
	display: inline-block;
	padding: 0 1rem;
	border: 1px solid #666;
	border-radius: 2px;
	font-size: 1em;
	
}
#guild_coupon_area .hint {
	display: none;
	font-weight: normal;
	line-height: 1.5;
	
}

#guild_coupon_area .liStyle02{
	flex-grow: 4;
}

/*------------------------------------------------------------
	動画
------------------------------------------------------------*/
#pickup_movie_area > ul li, #archive_movie_area > ul li {
	display: flex;
	flex-flow: column nowrap;
}
#pickup_movie_area > ul dl + p, #archive_movie_area > ul dl + p {
	flex-grow: 3;
}
#pickup_movie_area .link_button a, #archive_movie_area .link_button a {
	padding: 0.5rem;
	width: 70%;
	margin: 1rem auto 0;
}
/*------------------------------------------------------------
	フレーム切り替え
------------------------------------------------------------*/
#setting_frame_area label {
	display: block;
	padding: 10px;
	margin: 0 0 10px 0;
	border-radius: 5px;
	cursor: pointer;
}
#setting_degree_area label {
	display: block;
	cursor: pointer;
	padding: 0.5rem;
	margin-bottom: 0.5rem;
	background: #ccc;
}
#setting_frame_area input:checked + label, #setting_degree_area input:checked + label {
	background: #ffeede;
}
/*

#setting_degree_area label:before{
	content: "〇";
	display: inline-block;
	padding: 0 1rem 0 0;	
}
#setting_degree_area input:checked + label:before{
	content: "●";
	display: inline-block;
	padding: 0 1rem 0 0;	
}
*/
#setting_frame_area input, #setting_degree_area input {
	display: none;
}

#setting_icon_area dt {
	font-size: 1.4rem;
	font-weight: bold;
}
#setting_icon_area dd input[type="file"] {
	display: none;
}
#setting_icon_area dd label, #setting_icon_area dd a {
	display: block;
	padding: 0.5rem 1rem;
	text-align: center;
	color: #fff;
	background: linear-gradient(to right, #a51919, #e33232);
	margin: 0 0 5px 0;
	border-radius: 5px;
	cursor: pointer;
}
#setting_icon_area dd label:hover, #setting_icon_area dd a:hover {
	background: linear-gradient(to right, #e33232, #a51919);
}
#setting_icon_area dd:last-child {
	font-size: 1.2rem;
}
@media all and (min-width: 420px) {
	#setting_icon_area dt {
		font-size: 1.6rem;
	}
}
@media all and (min-width: 897px) {
	#setting_icon_area dd {
		float: left;
		width: 30%;
		margin: 0 5% 0 0;
	}
	#setting_icon_area dd:last-child {
		width: 60%;
	}
}
#setting_frame_area + #profile_area {
	position: absolute;
	top: -27rem;
	left: 0;
	width: 100%;
	margin: 0;
	border-radius: 0;
	z-index: 100;
}
#setting_frame_area + #profile_area.fixed {
	position: fixed;
	top: 0;
}
#setting_frame_area + #profile_area .flex {
	display: flex;
	flex-flow: column nowrap;
}
#setting_frame_area + #profile_area .icon {
	margin: 0 auto;
}
#setting_frame_area + #profile_area .icon + div {
	text-align: center;
}
#setting_frame_area + #profile_area input {
	display: inline-block;
	padding: 0.5rem;
	text-align: center;
	color: #fff;
	background: linear-gradient(to right, #a51919, #e33232);
	margin: 0.5rem 0 0 0;
	border-radius: 5px;
	border: none;
	cursor: pointer;
	width: 50%;
	font-size: 1.2rem;
}
#setting_frame_area + #profile_area input:hover {
	background: linear-gradient(to right, #e33232, #a51919);
}
#setting_icon_area {
	margin-top: 29rem;
}

#setting_icon_area .attention li{
	font-size: 1.2rem;
}

@media all and (min-width: 420px) {

#setting_frame_area + #profile_area .flex {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
}
#setting_frame_area + #profile_area .icon {
		margin: 0 2rem;
	}
#setting_frame_area + #profile_area .icon + div {
	display: flex;
	flex-flow: column nowrap;
	flex-grow: 4;
}

#setting_frame_area + #profile_area input{
		width: 100%;
	}
}

@media all and (min-width: 897px) {
	#setting_frame_area + #profile_area {
		top: -30rem;
		left: 20px;
		width: 960px;
		margin: 0;
		border-radius: 10px;
	}
	#setting_frame_area + #profile_area > div.flex{
		margin: 0 auto;
		max-width: 70%;
	}
	#setting_frame_area + #profile_area.fixed {
		top: 0;
		left: 0;
		width: 100%;
		min-width: 1240px;
		border-radius: 0;
	}
#setting_frame_area + #profile_area .icon + div {
	display: flex;
	flex-grow: 4;
	height: 200px;
	justify-content: center;
	padding: 0 0 0 2rem;
	}
	#setting_frame_area + #profile_area input {
		margin: 0 0 0.5rem 0;
		font-size: 1.4rem;
	}
	#setting_icon_area {
		margin-top: 32rem;
	}
}
/*------------------------------------------------------------
setting_menu_area
------------------------------------------------------------*/
#setting_menu_area li {
	border: 1px solid #9e826c;
	border-radius: 5px;
	margin: 0 0 5px 0;
}
#setting_menu_area li a {
	border-radius: 5px;
	padding: 1em;
	display: block;
	background-image: linear-gradient(180deg, rgba(255, 255, 255, 1) 50%, rgba(215, 215, 215, 1));
	position: relative;
	font-size: 1rem;
}
#setting_menu_area li a:hover {
	background-image: linear-gradient(180deg, rgba(215, 215, 215, 1) 50%, rgba(255, 255, 255, 1));
}
#setting_menu_area li a:after {
	font-family: "Font Awesome 5 Free";
	content: "\f04b";
	color: #e8b48b;
	font-weight: bold;
	font-size: 1.6rem;
	line-height: 1.6rem;
	display: inline-block;
	position: absolute;
	right: 1em;
	top: 50%;
	margin: -0.8rem 0 0 0;
}
#setting_menu_area li a:hover:after {
	color: #ff8c7a
}
@media all and (min-width: 420px) {
#setting_menu_area li a {
	font-size: 1.4rem;
}
#setting_menu_area li a:after {
	font-size: 2rem;
	line-height: 2rem;
	margin: -1rem 0 0 0;
}
}
@media all and (min-width: 897px) {
	#setting_menu_area ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#setting_menu_area li {
		width: 33%;
	}
}
/*------------------------------------------------------------
setting_item_area
------------------------------------------------------------*/
#setting_item_area ul.hint {
	list-style: decimal inside;
	padding: 1em;
}
#setting_item_area ul.hint li {
	padding: 0 0 0.5em 0;
}
/*------------------------------------------------------------
	#クエスト
  #quest_area_menu
------------------------------------------------------------*/
#quest_area_menu {
	border-radius: 0 0 10px 10px;
	margin-top: 7rem;
}
#quest_area_menu > ul.flex {
	margin: -6rem 0 0 -2rem;
	justify-content: space-between;
	width: calc(100% + 4rem);
}
#quest_area_menu > ul.flex li {
	width: calc(100%/3);
}
#quest_area_menu > ul.flex li a {
	background: #E2D6C4;
	display: block;
	border-radius: 10px 10px 0 0;
	padding: 1rem 0;
	font-weight: bold;
	text-align: center;
	border: 1px solid #9e826c;
}
#quest_area_menu > ul.flex li a:hover, #quest_area_menu > ul.flex li a.on {
	background: #FFF;
	border: none;
}
/*------------------------------------------------------------
	#クエスト
		comLinkList
------------------------------------------------------------*/
.quest_search_box h3 {
	padding: 1rem 0;
}
.comLinkList {
	position: relative;
	display: flex;
	flex-wrap: wrap;
}
.comLinkList li {
	margin: 0 5px 5px 0;
	width: calc(49% - 5px);
}
.comLinkList li a {
	padding: 3px 5px 4px;
	display: block;
	color: #FFF;
	font-size: 1rem;
	font-weight: bold;
	text-align: center;
	position: relative;
	letter-spacing: 0.1rem;
	box-sizing: border-box;
	background: #2e0f00;
	border: 2px solid #d6a867;
}
@media all and (min-width: 420px) {
	.comLinkList li {
		width: 32%;
	}
}
@media all and (min-width: 897px) {
	.comLinkList li {
		width: 19%;
	}
}
/*------------------------------------------------------------
	#クエスト
  #quest_area
------------------------------------------------------------*/
#quest_area {
	padding: 0;
	background: none;
}
#quest_area article {
	position: relative;
	background: #fff;
	border-radius: 10px;
	padding: 2rem;
	margin-bottom: 2rem;
	display: flex;
	flex-direction: column;
}
#quest_area article h1{
	font-size: 1.4rem;
	line-height: 1.4;
}

#quest_area article .flex{
	flex-flow: row nowrap;
	justify-content: space-between;
}
#quest_area article div.img {
	width: 100%;
	height: auto;
}

#quest_area article div.img + div{
	flex-grow: 2;
	margin: 0 0 0 0.5rem;
}
#quest_area article li {
	font-size: 1.2rem;
}
#quest_area article li.link_button a {
	width: 100%;
	margin: 0 0 0.5rem 0;
	padding: 0.5rem;
	font-size: 1.2rem;
}

#quest_area article ul + p{
	position: absolute;
	top:0;
	right: 0.5rem;
}
#quest_area article .fas:before{
	color: #F9551F;
}

@media all and (min-width: 420px) {
	#quest_area article h1{
	font-size: 1.6rem;
	line-height: 1.6;
	}
	#quest_area article div.img {
		width: 15rem;
		height: auto;
	}
	#quest_area article li.link_button {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#quest_area article li.link_button a {
		width: 49%;
	}
}
@media all and (min-width: 897px) {
	#quest_area {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
	}
	#quest_area article {
		width: 49%;
	}
}
/*------------------------------------------------------------
	#setting_user_area
		Form
------------------------------------------------------------*/
#setting_user_area select, #setting_user_area input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):not([type="image"]) {
	width: 100%;
	padding: 1rem;
	margin: 0 1rem 1rem 0;
	font-size: 1.4rem;
	border: 1px solid #ccc;
	border-radius: 5px;
	-webkit-appearance: none;
	appearance: none;
}
#setting_user_area dl {
	margin-bottom: 2rem;
}
#setting_user_area dt {
	font-size: 1.6rem;
	font-weight: bold;
	margin-bottom: 0.5rem;
}
#setting_user_area dd, #setting_user_area ul {
	margin-bottom: 2rem;
	padding-bottom: 1rem;
}
#setting_user_area dt span {
	margin-left: 1rem;
	font-size: 1rem;
	line-height: 1;
	font-weight: normal;
}
#setting_user_area dt .must {
	padding: 0.3rem 0.5rem;
	color: #fff;
	display: inline-block;
	text-align: center;
	box-sizing: border-box;
	background: linear-gradient(to bottom, #8d2121 0%, #b90000 100%);
	border-radius: 5px;
}
#setting_user_area dd select {
	background: #fff url("../img/common/icon06.png") no-repeat right 8px center / 8px auto;
}
#setting_user_area select.month, #setting_user_area select.day {
	width: calc(calc(100% - 1.5rem) / 2);
	background-position: right 16px center;
}
#setting_user_area select.day {
	margin-right: 0;
}
#setting_user_area select.year {
	width: 100%;
}
@media all and (min-width: 420px) {
	#setting_user_area select.year, #setting_user_area select.month, #setting_user_area select.day {
		width: calc(calc(100% - 3rem) / 3);
	}
}
@media all and (min-width: 897px) {
	#setting_user_area dl {
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;
		padding: 3rem 5rem;
	}
	#setting_user_area ul {
		padding: 3rem 5rem;
	}
	#setting_user_area dt {
		width: 15em;
		margin-bottom: 2rem;
		padding-bottom: 1rem;
		border-bottom: 1px solid #A4A4A4;
	}
	#setting_user_area dd {
		width: calc(100% - 15em);
		margin-bottom: 2rem;
		padding-bottom: 1rem;
		border-bottom: 1px solid #A4A4A4;
	}
}
#setting_user_area dl + .link_button, #setting_user_area dl + .flex {
	width: 50%;
	margin: auto;
	justify-content: space-between;
}
#setting_user_area dl + .flex div {
	width: 49%;
}
/*ここまで*/

/*------------------------------------------------------------
	comLink
------------------------------------------------------------*/
.comLink {
	text-align: center;
}
.comLink a {
	display: block;
	position: relative;
	overflow: hidden;
}
.comLink a .inn {
	padding: 12px 5px;
	display: block;
	color: #FFF;
	font-size: 1.2rem;
	font-weight: 700;
	position: relative;
	letter-spacing: 0.05em;
	background: -webkit-linear-gradient(left, #e33232, #a51919);
	background: -o-linear-gradient(right, #e33232, #a51919);
	background: -moz-linear-gradient(right, #e33232, #a51919);
	background: linear-gradient(to right, #e33232, #a51919);
}
.comLink a .inn::before {
	margin-top: -3px;
	width: 12px;
	height: 6px;
	position: absolute;
	left: 15px;
	top: 50%;
	background: url("../../../../img/common/icon07.png") no-repeat left center;
	background-size: 12px auto;
	content: "";
}
.comLink a .inn::after {
	margin-top: -3px;
	width: 12px;
	height: 6px;
	position: absolute;
	right: 15px;
	top: 50%;
	background: url("../../../../img/common/icon08.png") no-repeat right center;
	background-size: 12px auto;
	content: "";
}
@media all and (min-width: 897px) {
	.comLink a::after {
		content: "";
		position: absolute;
		height: 250px;
		width: 100px;
		background-color: #fff;
		opacity: 0.2;
		transform: rotate(35deg);
		top: -80px;
		left: -140px;
		transition: 0.3s;
	}
	.comLink a:hover::after {
		left: 120%;
	}
}
@media all and (max-width: 420px) {
	.comLink a .inn {
		font-size: 1rem;
	}
}
