@charset "UTF-8";
/* CSS Document */

.main-content{
	font-family: "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", "ＭＳ ゴシック", sans-serif;
  font-weight: 500;
	margin: auto;
	padding-bottom: 70px;
}


/* title */
.title{
	text-align: center;
}

.title > img{
	width: 100%;
	max-width: 1000px;
}


/* content */
.content{
	margin: auto;
	padding: 40px 0;
	max-width: 1000px;
}

.itembox img{
	display: block;
	margin: 0 auto;
	max-width: 850px;
	width: 100%;
}
.head > img{
	margin-left: 20px;
}

.head-img-1{width:53%}
.head-img-2{width:71%}
.head-img-3{width:93%}
.head-img-4{width:86.5%}
.head-img-5{width:71.5%}
.head-img-6{width:81.5%}
.head-img-7{width:57%}
.head-img-8{width:86.5%}
.head-img-9{width:75%}

.headsub{
	box-sizing: border-box;
	margin-top: 20px;
	padding: 0 20px 30px;
	text-align: justify;
}

.itembox img.small{
	margin: auto;
	width: 80%;
}


.itembox a{
	border-bottom: 2px dashed #ccc;
	box-sizing: border-box;
	display: block;
	font-size: 14px;
	padding: 10px;
	position: relative;
}
.itembox a:first-of-type{
	border-top: 2px dashed #ccc;
	margin-top: 20px;
}
.itembox a::after{
	background: #45423f;
	border-radius: 4px;
	color: #fff;
	content: "Check";
	display: block;
	font-size: 10px;
	padding: 3px 0;
	position: absolute;
	text-align: center;
	transform: translateY(-50%);
	width: 50px;

	top: 50%;
	right: 20px;
}


@media screen and (min-width:640px){
/* ----- */
/* P   C */
/* ----- */
.txt-left,
.txt-right{
	display: flex;
}
.txt-left .txtbox,
.txt-right .txtbox{
	margin-top: 50px;
}
.txt-left .txtbox{
	margin-right: 40px;
}
.txt-right .txtbox{
	order: 1;
	margin-left: 50px;
}
.txt-top .txtbox{
	display: flex;
	justify-content: center;
}


.head-img-1{width:215px}
.head-img-2{width:285px}
.head-img-3{width:375px}
.head-img-4{width:345px}
.head-img-5{width:280px}
.head-img-6{width:330px}
.head-img-7{width:227px}
.head-img-8{width:333px}
.head-img-9{width:292px}

.headsub{
	margin-top: 30px;
	margin-left: 50px;
	width: 400px;
}

.itembox img.small{
	margin: auto;
	width: 450px;
}
.itembox > .small + div{
	max-width: 450px;
}

.itembox img.medium{
	width: 600px;
}
.itembox > .medium + div{
	max-width: 600px;
}


.itembox > div{
	margin: auto;
	max-width: 850px;
}

.itembox a{
	align-items: center;
	border: none!important;
	display: flex;
	justify-content: flex-end;
	padding: 2px;
	position: static;
}
.itembox a:first-of-type{
	margin-top: 10px;
}
.itembox a:hover{
	opacity: .5;
}
.itembox a::after{
	display: inline-block;
	margin-left: 10px;
	padding: 1px 0 0;
	position: static;
	transform: translateY(0);
	width: 50px;
}

}/* end media */
