@charset "UTF-8";


/**
 * reset
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
img {
	max-width:100%;
	height:auto;
	vertical-align:bottom;
}
strong {
	font-weight: bolder;
}
a:link, a:visited, a:active, a:hover {
	outline: none;
	text-decoration: none;
}



/**
 * micro clearfix 
 */
.cf:before, .cf:after {
	content: "";
	display: table;
}
.cf:after { clear: both; }

.clear {
	clear: both;
}
html {
	font-size:62.5%;
}

body {
	background: none;
	text-align: left;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	font-weight: 400;
	font-style: normal;
    font-size: 1.5rem;
	letter-spacing: 0.2em;
	line-height: 2;
	color: #454545;
	font-feature-settings:"palt";
	-webkit-text-size-adjust:none;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
	line-height:1.4;
}
.inner {
	max-width:1100px;
	padding: 0 35px;
	margin: auto;
}

.nowrap {
	white-space:nowrap;

}
@media only screen and (min-width:769px) {
	.sp {
		display:none !important;
	}
}
@media only screen and (min-width:375px) {
	.sp_s {
		display:none !important;
	}
}
@media only screen and (max-width:768px) {
	body {
		line-height: 1.8;
		font-size:1.4rem;
	}
	.pc {
		display:none !important;
	}
	.inner {
		padding: 0 28px;
	}
}
/**/
@media print {
	.inner {
		width:1000px;
	}
	.sp {
		display: none;
	}
}


/**
 * anime
 */
.ani_slideup {
	opacity:0;
	transform:translateY(10px);
}
.ani_slideup.on {
	transition:opacity 0.8s, transform 0.8s ease-out;
	opacity:1;
	transform:translateY(0) !important;
}
.ani_btn {
	transform: scale(0.85); 
	opacity: 0;
}
.ani_btn.on {
	transition: opacity .4s ease-in, transform .4s cubic-bezier(0.175, 0.885, 0.320, 1.275);
	transform: scale(1); 
	opacity: 1;
}


/**
 * 
 */
.btns > * + * {
	margin-top: 1em;
}
.btn_link,
.btn_link_inv,
.btn_cart,
.btn_more {
	box-sizing: border-box;
	display: block;
	width: 100%;
	border: solid 1px #000;
	border-radius: 200px;
	background: #fff;
	padding: 15px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	text-decoration: none;
	max-width: 390px;
	color: #000;
	line-height: 1.2;
	font-size: 1em;
	transition: opacity 0.2s;
	cursor: pointer;
}
.btn_link_inv {
	background: #000;
	color: #fff !important;
}
.btn_cart {
	background: linear-gradient(135deg, #f09b97 0%,#fff2cc 100%);
}
.btn_link:hover,
.btn_link_inv:hover,
.btn_cart:hover,
.btn_more:hover {
	opacity: 0.55;
	text-decoration: none !important;
}
.btn_more {
	position: relative;
}
.btn_more::before,
.btn_more::after {
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	border-radius: 100px;
	background: #E65543;
	margin: auto;
	content: '';
}
.btn_more::before {
	width: 20px;
	height: 4px;
	right: 20px;
}
.btn_more::after {
	width: 4px;
	height: 20px;
	right: 28px;
}

.btn_cart,
.icon_mypage {
	position: relative;
}
.btn_cart::after,
.icon_mypage::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 20px;
	margin: auto;
	content: '';
}
.btn_cart::after {
	width: 28px;
	height: 20px;
	background: url("../img/icon_cart1.svg") no-repeat center center / contain;
}
.icon_mypage::after {
	width: 27px;
	height: 22px;
	background: url("../img/icon_mypage.svg") no-repeat center center / contain;
}
@media only screen and (max-width:413px) {
	.btn_cart::after {
		right: 12px;
	}
	.icon_mypage::after {
		right: 10px;
	}
}


/**
 * #button
 */
#button {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	background: #FBF1E4;
	text-align: center;
	transform: translateY(100%);
	transition: transform 0.2s ease-in;
}
#button.act {
	transform: translateY(0);
	transition: transform 0.2s ease-out;
}
#button li {
	box-sizing: border-box;
	display: inline-block;
	max-width: 50%;
	padding: 15px;
}
#button li a {
	width: 320px;
	max-width: 100%;
}
@media only screen and (max-width:768px) {
	#button li {
		width: 50%;
	}
	#button li:nth-child(odd) {
		padding-right: 7px;
	}
	#button li:nth-child(even) {
		padding-left: 7px;
	}
	#button li a {
		width: 100%;
	}
}
@media only screen and (max-width:413px) {
	#button li a {
		padding-right: 25px;
		font-size: 1.2rem;
	}
	
}
@media only screen and (max-width:374px) {
	#button li a {
		padding-right: 30px;
	}
}


/**
 * header
 */
header {
	position: fixed;
	top:0;
	left: 0;
	width: 100%;
	background: #fff;
	z-index: 1000;
}
header .inner {
	position: relative;
	padding: 15px 20px;
}
header #logo {
	position: relative;
	z-index: 2000;
}
header #btn_menu {
	position: absolute;
	top: 25px;
	right: 20px;
	width:35px;
	height: 24px;
	cursor: pointer;
	z-index: 2000;
}
header #btn_menu div {
	position:absolute;
	border-radius:10px;
	width:35px;
	height:3px;
	background-color:#000;
}
header #btn_menu div:nth-child(2) {
	transform:translateY(10px);
}
header #btn_menu div:nth-child(3) {
	transform:translateY(20px);
}
#menu {
	display: none;
	position: fixed;
	top:0;
	left: 0;
	z-index: 1500;
}
#menu_inner {
	position: relative;
	background: #fff;
	width: 100vw;
	height: 100vh;
}
#menu_inner ul {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	transform: translate(-50%, -50%);
	text-align: center;
}
#menu_inner li {
	padding: 10px 0;
	font-size: 1.8rem;
}
#menu_inner li.sub {
	margin-top: 30px;
	font-size: 1.4rem;
}
#menu_inner li.sub + .sub{
	margin-top: 0;
}
#menu_inner a {
	color: #454545;
	transition: color 0.2s;
}
#menu_inner a:hover {
	color: #F09B97;
}
@media only screen and (max-width:768px) {
	header .inner {
		padding: 10px 15px;
	}
	header #logo img {
		width: 290px;
	}
	header #btn_menu {
		top: 13px;
		right: 15px;
	}
	#menu_inner li {
		font-size: 1.6rem;
	}
	#menu_inner li.sub {
		margin-top: 30px;
		font-size: 1.2rem;
	}
}
@media only screen and (max-width:413px) {
	header .inner {
		padding: 12px 15px;
	}
	header #logo img {
		width: 260px;
	}
	header #btn_menu {
		top: 14px;
	}
}
@media only screen and (max-width:374px) {
	header .inner {
		padding: 15px 15px;
	}
	header #logo img {
		width: 220px;
	}
}


#container {
	overflow: hidden;
}
.contents h2 {
	position: relative;
	margin-bottom: 1em;
	text-align: center;
	font-size: 3.3rem;
}
.contents h2::after {
	display: block;
	width: 80px;
	height: 3px;
	background: #454545;
	border-radius: 100px;
	margin: 10px auto 0 auto;
	content: '';
}
@media only screen and (max-width:768px) {
	.contents h2 {
		font-size: 1.8rem;
	}
	.contents h2::after {
		width: 60px;
		height: 2px;
		margin: 6px auto 0 auto;
	}
}


/**
 * #products
 */
#products {
	padding: 130px 0;
}
#products .pd-link {
	position: relative;
	box-sizing: border-box;
	float: left;
	width: 50%;
	top: 100px;
	padding-right: 60px;
	text-align: center;
}
#products .pd-link:hover {
	opacity: 0.7;
}
/* #products figure {
	position: relative;
	box-sizing: border-box;
	float: left;
	width: 50%;
	top: 100px;
	padding-right: 60px;
	text-align: center;
} */
#products figure span {
	box-sizing: border-box;
	display: block;
	position: absolute;
	top: -60px;
	left: -20px;
	width: 120px;
	height: 120px;
	background: #FF8F81;
	border-radius: 300px;
	padding-top: 2.2em;
	text-align: center;
	line-height: 1.4;
	letter-spacing: 0;
	font-size: 1.6rem;
	color: #fff;
}
#products .txt0 {
	box-sizing: border-box;
	float: right;
	width: 50%;
	padding-left: 60px;
}
#products .txt0 h2 {
	margin-bottom: 1em;
	line-height: 1.4;
	text-align: left;
	font-size: 3.7rem;
	letter-spacing: 0.3em;
}
#products .txt0 h3 {
	margin-bottom: 1.5em;
	line-height: 2;
	text-align: left;
	font-size: 2.5rem;
	letter-spacing: 0.3em;
}
#products .txt0 h3 span {
	font-size: 1.6rem;
}
#products .txt0 p {
	line-height: 2;
	text-align: left;
	font-size: 2rem;
	letter-spacing: 0.3em;
}

#products .txt1 {
	clear: both;
	margin-top: 8em;
	text-align: center;
}
#products .txt1 h2 {
	margin-bottom: 1em;
	line-height: 2.4;
	font-size: 2.7rem;
}
#products .txt1 h3 {
	margin-bottom: 1em;
	line-height: 1.6;
	font-size: 1.8rem;
}
#products .txt1 .note {
	position: relative;
	margin-top: 3em;
	font-size: 1rem;
}
#products .txt1 .note::before {
	/*position: absolute;
	left: 0;*/
	content: '※';
}
#products .txt1 .note + .note {
	margin-top: 0.5em;
}
#products .txt1 .note1 {
	position: relative;
	margin-top: 3em;
	font-size: 1rem;
}
@media only screen and (max-width:768px) {
	#products {
		padding: 10px 0 60px 0;
	}
	/* #products figure, */
	#products .txt0 {
		float: none;
		width: 100%;
		padding: 0;
	}
	/* #products figure {
		top: 0;
    margin-top: 2.5em;
	} */
	#products .pd-link {
		top: 0;
    margin-top: 2.5em;
		float: none;
		width: 100%;
		padding: 0;
		display: block;
	}
	#products figure span {
		top: -30px;
		left: 0;
		width: 70px;
		height: 70px;
		padding-top: 1.4em;
		font-size: 1.1rem;
	}
	#products figure img {
		width: 75%;
	}

	#products .txt0 h2 {
		margin-bottom: 0.8em;
		text-align: center;
		font-size: 2rem;
	}
	#products .txt0 h3 {
		margin-bottom: 1em;
		line-height: 1.7;
		text-align: center;
		font-size: 1.6rem;
	}
	#products .txt0 h3 span {
		font-size: 1.1rem;
	}
	#products .txt0 p {
		text-align: center;
		font-size: 1.4rem;
	}

	#products .txt1 {
		margin-top: 0;
	}
	#products .txt1 h2 {
		margin-bottom: 1.5em;
		line-height: 1.7;
		font-size: 1.8rem;
	}
	#products .txt1 h3 {
		margin-bottom: 0;
		line-height: 1.8;
		font-size: 1.2rem;
	}
	#products .txt1 p {
		line-height: 1.8;
		font-size: 1.2rem;
	}
	#products .txt1 p.note,
	#products .txt1 p.note1 {
		font-size: 0.9rem;
		text-align: left;
	}

	#products .txt1 .note {
		position: relative;
		padding-left: 1.2em;
	}
	#products .txt1 .note::before {
		position: absolute;
		left: 0;
	}
}


/**
 * #video
 */
#video {
	padding: 130px 0;
	background:url("../img/bg0.png"), linear-gradient(135deg, #f09b97 0%,#fff2cc 100%);
	background-size: 32px, auto;
}
#video video {
	display: block;
	margin: auto;
	width: 90%;
	/*position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);*/
}
#video .box {
	position: relative;
	overflow: hidden;
}
#video .box video {
	max-width: 980px;
}
#video.open .btns {
	display: none;
}
@media only screen and (max-width:768px) {
	#video {
		padding: 60px 0;
		background-size: 24px, auto;
	}
}

/**
 * #media
 */
#media {
	text-align: center;
	padding: 130px 0;
}
#media h3 {
	margin: 2em 0 1em 0;
	font-size: 2.6rem;
}
#media p {
	margin: 0 0 2em 0;
	font-size: 1.8rem;
}
#media ul {
	display: flex;
	flex-wrap: wrap;
	margin: 20px -30px;
}
#media li {
	box-sizing: border-box;
	width: 16.666%;
	padding: 20px 30px;
}
#media.open .btns {
	display: none;
}
@media only screen and (max-width:768px) {
	#media {
		text-align: center;
		padding: 60px 0;
	}
	#media h3 {
		font-size: 1.6rem;
	}
	#media p {
		font-size: 1.3rem;
	}
	#media ul {
		margin: 10px -20px;
	}
	#media li {
		width: 33.333%;
		padding: 10px 20px;
	}
}

/**
 * #about
 */
#about {
	background: #FDFAF7;
	padding: 120px 0;
}
#about h3 {
	margin-bottom: 3em;
	text-align: center;
	line-height: 1.8;
	font-size: 2.4rem;
}
#about ul {
	margin: 0 -20px;
}
#about li {
	box-sizing: border-box;
	float: left;
	width: 33.33%;
	padding: 0 20px;
	text-align: center;
}
#about li h4 {
	margin: 1.5em 0;
	font-size: 2rem;
}
@media only screen and (max-width:768px) {
	#about {
		padding: 60px 0;
	}
	#about h3 {
		font-size: 1.6rem;
	}
	#about ul {
		margin: 0;
	}
	#about li {
		float: none;
		width: 100%;
		padding: 0;
	}
	#about li + li {
		margin-top:80px; 
	}
	#about li img {
		width: 132px;
	}
	#about li h4 {
		margin: 1.5em 0 0.5em 0;
		font-size: 1.6rem;
	}
	#about li p {
		font-size: 1.2rem;
	}
}


/**
 * #step
 */
#step {
	padding: 120px 0;
	text-align: center;
}
#step ol {
	margin: 0 20px;
}
#step li {
	box-sizing: border-box;
	display: inline-block;
	/* width: 33.33%; */
	width: 25%;
	padding: 30px 20px;
	vertical-align: top;
	transition: opacity .4s ease-in, transform .4s cubic-bezier(0.175, 0.885, 0.320, 1.275);
	transform: scale(0.85); 
	opacity: 0;
}
#step .on li {
	transform: scale(1); 
	opacity: 1;
}
#step li:nth-child(2) {
	transition-delay: 0.2s;
}
#step li:nth-child(3) {
	transition-delay: 0.4s;
}
#step li:nth-child(4) {
	transition-delay: 0.6s;
}
#step li:nth-child(5) {
	transition-delay: 0.8s;
}
#step li h3 {
	margin: 0.6em 0 0 0;
	font-size: 2.6rem;
}
#step li h3 span {
	display: block;
	margin-top: 1em;
	font-size: 1.2rem;
	font-weight: 400;
}
@media only screen and (max-width:768px) {
	#step {
		padding: 60px 0 0 0;
	}
	#step ol {
		margin: 30px 0 0 0;
	}
	#step li {
		display: block;
		position: relative;
		width: 50%;
		height: 65vw;
		padding: 0 15px;
		text-align: center;
	}
	#step li:nth-child(odd) {
		float: left;
		padding: 0 10px 0 0;
	}
	#step li:nth-child(even) {
		float: right;
		padding: 32vw 0 0 10px;
	}
	#step li:nth-child(odd)::after,
	#step li:nth-child(even)::after {
		position: absolute;
		width: 50vw;
		height: 1px;
		background: #BEBEBE;
		content: '';
		z-index: 0;
		opacity: 0;
	}
	#step li:nth-child(odd)::after {
		transform: rotate(30deg);
		top: 50%;
		left: 50%;
	}
	#step li:nth-child(even)::after {
		transform: rotate(-30deg);
		bottom: 0;
		right: 50%;
	}
	#step li:last-child {
		padding: 32vw 0 56vw 10px;
	}
	#step li:last-child::after {
		display: none;
	}
	#step .on li:nth-child(odd)::after,
	#step .on li:nth-child(even)::after {
		transition: opacity 0.3s ease-in 1s;
		opacity: 1;
	}
	#step li img {
		width: 80%;
		position: relative;
		z-index: 1;
	}
	#step li h3 {
		font-size: 1.6rem;
	}
	#step li h3 span {
		font-size: 1rem;
	}
}


/**
 * #kit
 */
#kit {
	padding: 120px 0;
	background:url("../img/bg0.png"), linear-gradient(135deg, #f09b97 0%,#fff2cc 100%);
	background-size: 32px, auto;
}
#kit h2 {
	margin-bottom: 2em;
}
#kit .embed {
	width: 640px;
	height: calc((100vw - 56px) * 0.5625);
	max-height: 360px;
	max-width: 100%;
	margin: auto;
}
#kit .video-js .vjs-big-play-button {
	box-sizing: border-box;
	width: 75px;
	height: 75px;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	border: none;
	border-radius: 500px;
}
#kit .vjs-big-play-button .vjs-icon-placeholder:before {
	line-height: 1;
	height: 0;
	font-size: 5rem;
	top: 12px;
}
@media only screen and (max-width:768px) {
	#kit {
		padding: 60px 0;
		background-size: 24px, auto;
	}
	#kit .video-js .vjs-big-play-button {
		width: 50px;
		height: 50px;
	}
	#kit .vjs-big-play-button .vjs-icon-placeholder:before {
		top: 10px;
		font-size: 3rem;
	}
}



/**
 * #age
 */
#age {
	padding: 120px 0;
	background: #FAFAFA;
}
#age h3 {
	margin: 4em 0 1em 0;
	text-align: center;
	line-height: 1.8;
	font-size: 2.4rem;
}
#age figure {
	position: relative;
	max-width: 600px;
	margin: auto;
	margin-bottom: 1em;
	text-align: center;
}
#age #age_img1,
#age #age_img2 {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
#age .on #age_img1 {
	transition: opacity 0.3s ease-in 0.8s;
	opacity: 1;
}
#age .on #age_img2 {
	transition: opacity 0.3s ease-in 1.4s;
	opacity: 1;
}
#age p.note {
	text-align: center;
	color: #CF3D32;
}
#age p.copy {
	margin-top: 2em;
	text-align: center;
	font-size: 1rem;
}
@media only screen and (max-width:768px) {
	#age {
		padding: 60px 0;
	}
	#age h3 {
		background: url("../img/icon_check.svg") no-repeat left 6px / 18px auto;
		padding-left: 25px;
		text-align: left;
		font-size: 1.6rem;
	}
	
	#age .index h3 {
		margin: 1em 0;
	}
	#age .index .btns {
		margin-top: 2em;
	}
	#age .index .btn_link {
		position: relative;
	}
	#age .index .btn_link::before,
	#age .index .btn_link::after {
		display: block;
		position: absolute;
		top: 0;
		bottom: 0;
		border-radius: 100px;
		background: #E65543;
		margin: auto;
		content: '';
	}
	#age .index .btn_link::before {
		width: 20px;
		height: 4px;
		right: 20px;
	}
	#age .index .btn_link::after {
		width: 4px;
		height: 20px;
		right: 28px;
	}
	#age p.note {
		text-align: left;
		font-size: 1rem;
	}
	#age p.copy {
		text-align: left;
		font-size: 0.9rem;
	}
}


/**
 * #column
 */
#column {
	padding: 120px 0;
}
.column #column {
	padding: 0 0 120px 0;
}
#column ul {
    margin: 0 -25px;
    text-align: center;
}
#column li {
    box-sizing: border-box;
    display:inline-block;
    width: 33.3%;
    padding: 25px;
	vertical-align: top;
}
#column li a,
.column .links li a {
    display:block;
    text-align: left;
    color: #454545;
	transition: opacity 0.2s;
}
#column li a:hover,
.column .links li a:hover {
	opacity: 0.55;
}
#column li figure,
.column .links li figure {
    position: relative;
}
#column li figure img,
.column .links li figure img {
    width: 100%;
}
#column li figure .label,
.column .links li figure .label {
    position: absolute;
    bottom: 10px;
    left: 10px;
	z-index: 2;
}
#column li figure::after,
.column .links li figure::after {
	position:absolute ;
	top:0 ;
	bottom:0 ;
	left: 0;
	right: 0;
	margin: auto;
	width: 100.1%;
	height: 101%;
	border: solid 1px #fff;
	background: no-repeat center center / 100% 100%;
	content: '';
	z-index: 1;
}
#column li .txt,
.column .links .txt {
    padding: 0 10px;
}
#column li h3,
.column .links h3 {
    font-size: 2rem;
    margin: 0.6em 0;
}
#column li p,
.column .links p {
    font-size: 1.3rem;
}
#column li .more,
.column .links .more {
    font-size: 1.3rem;
    color: #FF8F81;
}

#column .tag {
	margin-bottom: 40px;
}
#column .tag li {
	width: auto;
	margin: 0;
    padding: 0 10px;
}
#column .tag li .label {
    padding: 3px 20px;
}

.label {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 8px;
    white-space: nowrap;
    color: #fff;
    font-size: 1.3rem;
}
.column .label {
    background: #FFC783;
}
.column .label::before {
	content: 'コラム';
}
.essay .label {
    background: #FF8F81;
}
.essay .label::before {
	content: 'エッセイ';
}
.manga .label {
    background: #ED7EC6;
}
.manga .label::before {
	content: 'マンガ';
}

#column li.column figure::after,
.column .links li.column figure::after {
	background-image: url("../img/column_cover0.png");
}
#column li.essay figure::after,
.column .links li.essay figure::after {
	background-image: url("../img/column_cover1.png");
}
#column li.manga figure::after,
.column .links li.manga figure::after {
	background-image: url("../img/column_cover2.png");
}

.column .links {
	margin-bottom: 40px;
}
.column .links li {
	display:block;
	width: 100%;
	padding: 25px 0;
}
.column .links li .cf {
	display: flex;
	align-items: center;
}
.column .links li figure {
	width: 46%;
}
.column .links li .txt {
	box-sizing: border-box;
	width: 54%;
	padding-left: 20px;
}
.column .links li figure .label {
	bottom: 8px;
	left: 0;
}
.column .links li h3 {
	margin-bottom: 1em;
	font-size: 1.8rem;
}
.column .links li p {
	font-size: 1.4rem;
}
.column .links li .more {
	font-size: 1.4rem;
}

#column .inner > .btns {
	margin-top: 40px;
}
@media only screen and (max-width:768px) {
	#column {
		padding: 60px 0;
	}
	.column #column {
		padding: 0 0 60px 0;
	}
	#column ul {
		margin: 0;
	}
	#column li {
		display:block;
		width: 100%;
		padding: 25px 0;
	}
	#column li .cf {
		display: flex;
		align-items: center;
	}
	#column li figure {
		width: 46%;
	}
	#column li figure .label {
		bottom: 8px;
		left: 0;
	}
	#column li .txt {
		box-sizing: border-box;
		width: 54%;
		padding: 0;
		padding-left: 20px;
	}
	#column li h3 {
		margin-bottom: 1em;
		font-size: 1.4rem;
	}
	#column li p {
		font-size: 1.2rem;
	}
	#column li .more {
		font-size: 1.2rem;
	}
	
	#column .tag {
		margin-bottom: 20px;
	}
	#column .tag li {
		display:inline-block;
		width: auto;
		margin: 0;
		padding: 0 10px;
	}
	.label {
		padding: 3px 10px;
		border-radius: 6px;
		font-size: 1rem;
	}
	
	.column .links li h3 {
		font-size: 1.4rem;
	}
	.column .links li p {
		font-size: 1.2rem;
	}
	.column .links li .more {
		font-size: 1.2rem;
	}
}


/**
 * #comment
 */
#comment {
	padding: 120px 0;
    background: #FAFAFA;
}
#comment li:nth-child(odd),
#comment li:nth-child(even) {
	box-sizing: border-box;
	width: 50%;
}
#comment li:nth-child(odd) {
	float: left;
	padding-right: 60px;
}
#comment li:nth-child(even) {
	float: right;
	padding-left: 60px;
}
#comment li .profile {
	display: flex;
	align-items: center;
	height: 380px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	margin-bottom: 1em;
}
#comment li:nth-child(odd) .profile {
	background-image: url("../img/comment_bg0.png");
}
#comment li:nth-child(even) .profile {
	background-image: url("../img/comment_bg1.png");
}
#comment li .profile figure {
	width: 40%;
	text-align: center;
}
#comment li .profile > div {
	width: 60%;
}
#comment li .profile h3 {
	margin-bottom: 1em;
	font-size: 2rem;
}
#comment li .profile p {
	font-size: 1.2rem;
}
#comment li .txt {
	padding-bottom: 30px;
	border-bottom: dashed 1px #707070;
}
@media only screen and (max-width:768px) {
	#comment {
		padding: 60px 0;
	}
	#comment li:nth-child(odd),
	#comment li:nth-child(even) {
		width: 100%;
		padding: 0;
	}
	#comment li + li {
		margin-top: 30px;
	}
	#comment li .profile {
		position: relative;
		height: 70vw;
		width: calc(100% + 40px);
		left: -20px;
	}
	#comment li .profile figure img {
		width: 78%;
	}
	#comment li .profile h3 {
		font-size: 1.6rem;
	}
	#comment li .profile p {
		font-size: 1rem;
	}
}


/**
 * #news
 */
#news {
	padding: 60px 0;
}
#news .ttl {
	box-sizing: border-box;
	float: left;
	width: 50%;
	padding-right: 60px;
}
#news .ttl h2 {
	box-sizing: border-box;
	padding-top: 200px;
	height: 490px;
	background: #FDFAF7;
	border: solid 1px #F4C0B6;
	border-radius: 20px;
}
#news .body {
	box-sizing: border-box;
	float: right;
	width: 50%;
	background: #fff;
	min-height: 490px;
	padding-left: 60px;
}
#news .inner li {
	border-bottom: dashed 1px #707070;
}
#news .inner li a {
	display: block;
	padding: 20px 0;
	font-size: 1.4rem;
	color: #454545;
}
#news .btns {
	margin-top: 50px;
}
@media only screen and (max-width:768px) {
	#news .ttl {
		float: none;
		width: 100%;
		padding: 0;
	}
	#news .ttl h2 {
		margin-top: 0;
		padding-top: 12vw;
		height: 35vw;
	}
	#news .body {
		float: none;
		width: 100%;
		min-height: 0;
		padding: 0;
	}
	#news .inner li a {
		padding: 10px 0;
	}
	#news .btns {
		margin-top: 40px;
	}
}


/**
 * .breadcrumb
 */
.breadcrumb {
	margin-bottom: 40px;
	white-space: nowrap;
	overflow: auto;
}
.breadcrumb li {
	display: inline-block;
	font-size: 1.4rem;
}
.breadcrumb li a {
	color: #F09B97;
}
.breadcrumb li::after {
	content: '  >';
	color: #9D9D9D;
}
.breadcrumb li:last-child::after {
	content: '';
}
@media only screen and (max-width:768px) {
	.breadcrumb {
		margin-bottom: 30px;
	}
	.breadcrumb li {
		font-size: 1.2rem;
	}
}
/**
 * .page
 */
.page #container {
	padding-top: 100px;
}
@media only screen and (max-width:768px) {
	.page #container {
		padding-top: 60px;
	}
}

/* #news, #single, #policy */
.page #news .inner,
.page #single .inner,
.page #policy .inner {
	max-width: 640px;
	padding-bottom: 120px;
}
.page #news h2 {
	margin-bottom: 55px;
}
.page #news .inner li:first-child {
	border-top: dashed 1px #707070;
}
.page #single .btns,
.page #policy .btns {
	margin-top: 50px;
}
@media only screen and (max-width:768px) {
	.page #news .inner,
	.page #single .inner,
	.page #policy .inner {
		padding-bottom: 80px;
	}
	.page #news h2 {
		margin-bottom: 30px;
	}
	.page #single .btns,
	.page #policy .btns {
		margin-top: 40px;
	}
}

/* #policy */
#single h1 {
	margin-bottom: 2em;
	font-size: 2.2rem;
}
@media only screen and (max-width:768px) {
	#single h1 {
		font-size: 1.8rem;
	}
}

/* #policy */
#policy h1 {
	text-align: center;
	margin-bottom: 2em;
	font-size: 2.2rem;
}
#policy ul {
	margin-top: 4em;
}
#policy li + li {
	margin-top: 4em;
}
#policy li h2 {
	margin-bottom: 1em;
	font-size: 1.8rem;
}
#policy .over {
	margin-top: 4em;
	text-align: right;
}
#policy li ol,
#policy li ul {
	margin-top: 1em;
}
#policy li ol li,
#policy li ul li {
	margin-top: 0.5em;
	margin-left: 3em;
}
#policy li ol li {
	list-style: decimal;
}
#policy li li ol li {
	list-style: upper-roman;
}
#policy li ul li {
	list-style: disc;
}
#policy li p + p {
	margin-top: 1em;
}
#policy a {
	color: #F09B97;
}
#policy a:hover {
	text-decoration: underline;
}
@media only screen and (max-width:768px) {
	#policy h1 {
		text-align: left;
		font-size: 1.8rem;
	}
	#policy ul {
		margin-top: 3em;
	}
	#policy li + li {
		margin-top: 3em;
	}
	#policy li h2 {
		font-size: 1.6rem;
	}
	#policy .over {
		margin-top: 3em;
	}
	#policy li ol li,
	#policy li ul li {
		margin-left: 2em;
	}
}


/**
* .error
*/
.errors .inner {
	padding-top: 60px;
	padding-bottom: 30px;
	text-align: center;
}
.errors h1 {
	margin: 30px 0;
	font-size: 2.4rem;
}
.errors p {
	font-size: 1.4rem;
}
.errors .btns {
	margin: 40px 0;
}
@media only screen and (max-width:768px) {
	.errors .inner {
		padding-top: 30px;
		padding-bottom: 0;
	}
	.errors h1 {
		font-size: 1.8rem;
	}
	.errors p {
		text-align: left;
		font-size: 1.2rem;
	}
}



/**
 * footer
 */
body {
	position: relative;
	min-height: 100vh;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 40px 0 90px 0;
	background: #F09B97;
	text-align: center;
	letter-spacing: 0.2em;
	font-size: 1.2rem;
	color: #000;
}
footer nav li {
	float: left;
	width: 40%;
	margin-bottom: 2em;
	text-align: left;
}
footer nav li:nth-child(3n) {
	width: 20%;
}
footer nav li a {
	color: #000;
}
footer .copy {
	margin-top: 2rem;
}
@media only screen and (max-width:768px) {
	footer {
		font-size: 1.2rem;
	}
	footer nav li,
	footer nav li:nth-child(3n) {
		float: none;
		width: 100%;
		margin-bottom: 1em;
		text-align: center;
	}
}