@charset "utf-8";

/***************************************************
	common.css
	共通レイアウトスタイル定義
***************************************************/


/* Base
------------------------------------------------------------ */
html {
	font-size: 62.5%;
}
body {
	line-height: 1.6;
	color: #231815;
	margin: 0;
	background: #ffffff;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	word-wrap: break-word;
}
@media only screen and (max-width: 640px) {
	body {
	}
}

img {
	vertical-align: top;
	max-width: 100%;
	height: auto;
}

/* Link
------------------------------------------------------------ */
a { outline: none; }
a:link {
	color: #231815;
	text-decoration: none;
}
a:visited {
	color: #231815;
	text-decoration: none;
}
a:hover {
	color: #231815;
	text-decoration: underline;
}

a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

/* 
-------------------------------------------------------------------*/
#cpContentBox {
	max-width: 1024px;
	margin: 0 auto;
	font-size: 1.8rem;
	padding-top:121px;
}
#cpContentBox.end{
	padding-top:0;
}
#cpContentBox .mainBox{

}
#cpContentBox .oneContentBox {
	margin: 70px 62px;
}
#cpContentBox .appBox {
	font-size: 2.2rem;
}
#cpContentBox .appBox .btnList {
	display: flex;
	justify-content: space-around;
}
#cpContentBox .appBox .btnList > li.appstore {
	width: 39.15%;
}
#cpContentBox .appBox .btnList > li.googleplay {
	width: 47.56%;
}
#cpContentBox .appBox .txt01 {
	margin: 1em 0 0 0;
	padding: 0 0 0 1em;
	text-indent: -1em;
}
#cpContentBox .appBox .list01 {
}
#cpContentBox .appBox .list01 > li {
	padding: 0 0 0 1em;
	text-indent: -1em;
}
#cpContentBox .oneContentBox .head {
	font-size: 4.2rem;
	font-weight: bold;
	text-align: center;
	line-height: 1.2;
	margin: 0 0 0.4em 0;
	padding: 0.25em;
	background: #FFE100;
}
#cpContentBox .oneContentBox .spanTxt {
	font-size: 4.9rem;
	font-weight: bold;
	text-align: center;
	margin: 0.2em 0 0 0;
}
#cpContentBox .oneContentBox .seasonTxt {
	font-size: 5.2rem;
	font-weight: bold;
	text-align: center;
	margin: 0.2em 0 0 0;
}
#cpContentBox .oneContentBox .list02 {
}
#cpContentBox .oneContentBox .list02 > li {
	padding: 0 0 0 1em;
	text-indent: -1em;
}
#cpContentBox .oneContentBox .txt02 {
	font-size: 3.2rem;
	font-weight: bold;
	margin: 0.5em 0 0 0;
}
#cpContentBox .oneContentBox sup {
	font-size: 68%;
	vertical-align: top;
}
#cpContentBox .oneContentBox .list03 {
}
#cpContentBox .oneContentBox .list03 > li {
	padding: 0 0 0 2em;
	text-indent: -2em;
}
#cpContentBox .oneContentBox .notion01 {
	color: #E60012;
}
#cpContentBox .oneContentBox .ttl01 {
	color: #B60081;
	font-size: 2rem;
}
#cpContentBox .oneContentBox .ttl01::before {
	content: "■";
}
#cpContentBox .oneContentBox .txt03 {
}
#cpContentBox .oneContentBox .ttl02 {
	color: #B60081;
	font-size: 2.7rem;
	margin: 0.5em 0 0 0;
}
#cpContentBox .oneContentBox .ttl02::before {
	content: "■";
}
#cpContentBox .oneContentBox .txt04 {
	font-size: 2.7rem;
	margin: 0 0 0 1em;
}
#cpContentBox .oneContentBox .contactList {
	display: flex;
	align-items: flex-start;
	font-size: 2.7rem;
	margin: 0.5em 0 0 1em;
}
#cpContentBox .oneContentBox .contactList > dt {
	font-size: 2.2rem;
	flex-shrink: 0;
	padding: 1em;
	border: 1px solid #231815;
}
#cpContentBox .oneContentBox .contactList > dd {
	font-size: 2.4rem;
	line-height: 1.1;
	margin: 0 0 0 0.5em;
}
#cpContentBox .oneContentBox .contactList > dd .tel {
	font-size: 4rem;
	font-weight: bold;
}

ul.download{
	width:492px;
	margin:0 auto;
}

ul.download:after{
	content:'';
	display:block;
	clear:both;
}

ul.download li{
	width:214px;
	float:left;
}

ul.download li:last-child{
	width:266px;
	float:right;
}

ul.download li a{
	display:block;
}

/* #banner =====================================================*/
#banner{
}
#banner .section-inner{
	width:1024px;
}
/*#banner .section-inner:after{
	content:'';
	display:block;
	padding-top:28px;
}*/
#banner p{
	margin: 0 62px 58px;
	/*margin-bottom:58px;*/
}
#banner p.banner_title {
	color: #b50081;
	font-size: 2em;
	font-weight: bold;
	text-align: center;
	margin-bottom: 10px;
}
/* #detail =====================================================*/
#detail{
}
#detail p{
	width:380px;
	margin:0 auto;
}
#detail p a{
	display:block;
}
#detail p:after{
	content:'';
	display:block;
	padding-top:26px;
}

@media only screen and (max-width: 640px) {
	#cpContentBox {
		font-size: 1.2rem;
		padding-top: 17.467vw;
    	margin-bottom: 4.534%;
	}
	#cpContentBox.end{
		padding-top: 0;
	}
	#cpContentBox .oneContentBox {
		margin: 30px 20px;
	}
	#cpContentBox .appBox {
		font-size: 0.65rem;
	}
	#cpContentBox .oneContentBox .head {
		font-size: 1.3rem;
		padding: 0.5em 0.1em;
	}
	#cpContentBox .oneContentBox .spanTxt {
		font-size: 1.75rem;
	}
	#cpContentBox .oneContentBox .seasonTxt {
		font-size: 1.75rem;
	}
	#cpContentBox .oneContentBox .txt02 {
		font-size: 1.4rem;
	}
	#cpContentBox .oneContentBox .ttl01 {
		font-size: 1.2rem;
	}
	#cpContentBox .oneContentBox .ttl02 {
		font-size: 1.2rem;
	}
	#cpContentBox .oneContentBox .txt04 {
		font-size: 1.2rem;
	}
	#cpContentBox .oneContentBox .contactList {
		font-size: 0.85rem;
	}
	#cpContentBox .oneContentBox .contactList > dt {
		font-size: 0.7rem;
	}
	#cpContentBox .oneContentBox .contactList > dd {
		font-size: 0.8rem;
		line-height: 1.4;
	}
	#cpContentBox .oneContentBox .contactList > dd .tel {
		font-size: 1.3rem;
	}
	
	ul.download{
		width:82.134%;
		margin:0 auto;
	}

	ul.download:after{
		content:'';
		display:block;
		clear:both;
	}

	ul.download li{
		width:43.507%;
		float:left;
	}

	ul.download li:last-child{
		width:54.221%;
		float:right;
	}

	ul.download li a{
		display:block;
	}

	/* #banner =====================================================*/
	#banner{
	}
	#banner .section-inner{
		width:100%;
	}
	/*#banner .section-inner:after{
		content:'';
		display:block;
		padding-top:4.934%;
	}*/
	#banner p{
		margin: 0 20px 6.534%;
		/*margin-bottom:6.534%;*/
	}
	#banner p.banner_title {
		font-size: 1.5em;
		margin-bottom: 0px;
	}
	
	/* #detail =====================================================*/
	#detail{
	}
	#detail p{
		width:50.668%;
		margin:0 auto;
	}
	#detail p a{
		display:block;
	}
	#detail p:after{
		content:'';
		display:block;
		padding-top:9.474%;
	}
}

