@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;600;&display=swap');
#g248012 {
	color: #000000;	
}

#g248012 .block,
#g248012 h2 .small {
	display: block;
}

#g248012 .center {
	text-align: center;
}

#g248012 #title,
#g248012 .box,
#g248012 #colors img {
	border-radius: 20px;
	margin-bottom: 100px;
}

#g248012 .text {
	font-size: 24px;
}

#g248012 #title {
	background: url(../../../img/usr/goods/g248012/bg_pc.png) no-repeat #eeeff6;
	background-position: left top;
	padding-bottom: 30px;
}

#g248012 #title .fix {
	padding: 30px;
}

#g248012 #title .total {
	font-size: 48px;
	line-height: 1.4em;
}

#g248012 #title .total .block {
	font-size: 40px;
}

#g248012 #title .total .blue {
	font-size: 72px;
	color: #345087;
}

#g248012 #title .period {
	background-color: #345087;
	color: #ffffff;
	font-size: 24px;
	padding: 0 10px;
}

#g248012 #title .text {
	margin: 0 30px 0;
	background-color: #ffffff;
	padding: 30px;
}

#g248012 .box {
	background-color: #ffffff;
	padding: 30px;
}

#g248012 .heading {
	margin-bottom: 60px;
}

#g248012 #secret_1 .heading h2 {
	background: url(../../../img/usr/goods/g248012/s_1.png) no-repeat;
	background-position: left center;
	padding: 10px 0 10px 195px;
}

#g248012 #secret_2 .heading h2 {
	background: url(../../../img/usr/goods/g248012/s_2.png) no-repeat;
	background-position: left center;
	padding: 10px 0 10px 195px;
}

#g248012 #secret_3 .heading h2 {
	background: url(../../../img/usr/goods/g248012/s_3.png) no-repeat;
	background-position: left center;
	padding: 10px 0 10px 195px;
}

#g248012 #secret_4 .heading h2 {
	background: url(../../../img/usr/goods/g248012/s_4.png) no-repeat;
	background-position: left center;
	padding: 10px 0 10px 195px;
}

#g248012 #secret_5 .heading h2 {
	background: url(../../../img/usr/goods/g248012/s_5.png) no-repeat;
	background-position: left center;
	padding: 10px 0 10px 195px;
}

#g248012 #secret_6 .heading h2 {
	text-align: center;
}

#g248012 h2 {
	font-size: 72px;
	color: #345087;
	line-height: 1.2em;
}

#g248012 h2 .small {
	font-size: 36px;
	color: #000000;
}

#g248012 #secret_1 dl {
	background-color: #eaf0fc;
	padding: 10px 15px;
	margin-bottom: 60px;
}

#g248012 #secret_1 dt {
	font-size: 36px;
	color: #345087;
}

#g248012 #secret_1 dd {
	font-size: 24px;
}

#g248012 .u_line {
	background:linear-gradient(transparent 60%, #fffc01 0%);
}

#g248012 #secret_1 #step_1,
#g248012 #secret_1 #step_2,
#g248012 #secret_1 #step_3 {
	border: 2px solid #baccef;
}

#g248012 #secret_1 .center {
	margin-top: 20px;
}

#g248012 #secret_2 .fea {
	width: 100%;
}

#g248012 #secret_2 .fea div {
	border: 2px solid #baccef;
	text-align: center;
}

#g248012 .colors .maincolor{
    padding:  5px;             /* 余白指定 */
	width: 100%;
	margin-bottom: 60px;
	justify-content: center;
}

#g248012 .colors .color-box{
    padding:  5px;             /* 余白指定 */
    display: flex;              /* フレックスボックスにする */
    flex-wrap: wrap;
	width: 100%; 
	justify-content: center;
}

#g248012 .colors .color-box{
    padding: 2px;
	display: inline-block;
    margin-bottom: 20px;              /* 外側の余白 */
    border-radius: 5px;        /* 角丸指定 */
    width: 48%;                 /* 幅指定 */
	text-align: center;
}

#g248012 .colors p {
	font-size: 24px;
	color: #262626;
	text-align: center;
	line-height: 1.3;
}

#g248012 #movie {
	text-align: center;
	margin-bottom: 100px;
}

#g248012 #movie iframe {
	width: 904px;
	height: 508px;
}

#g248012 #movie p {
	font-size: 14px;
}

@media screen and ( min-width:521px ){ /* tablet&PC */
.sp_display {
	display: none;		
}
	
#g248012 #title .fix .block,
#g248012 #title .fix .total,
#g248012 h2,
#g248012 #secret_1 dt {
	font-family:"游明朝", YuMincho,serif;
}

#g248012 #title .fix:after {
	content: "";
	clear: both;
	display: block;
}

#g248012 #title .fix p,
#g248012 #title .fix div {
	float: left;
}
	
#g248012 #title .fix p {
	margin-left: 50px;		
}

#g248012 #title .fix div {
	width: 640px;
	margin-left: 10px;
	margin-top: 20px;
}

#g248012 #secret_1 p {
	position: absolute;		
	width: 400px;
	margin-top: -260px;
	margin-left: 490px;
}	
	
}

@media screen and ( max-width:520px ){/* SP */
#g248012 h2 {/* 絶対必要 */
	padding: 0;
	background-color: transparent;
}
	
.pc_display {
	display: none;		
}
	
#g248012 #title .fix .block,
#g248012 #title .fix .total,
#g248012 h2,
#g248012 #secret_1 dt {
	font-family: 'Noto Serif JP', serif;
}	

#g248012 #title,
#g248012 .box,
#g248012 #colors img {
	border-radius: 10px;
	margin-bottom: 50px;
}

#g248012 .text {
	font-size: 13px;
}
	
#g248012 #title {
	background: url(../../../img/usr/goods/g248012/bg_sp.png) no-repeat #eeeff6;
	background-position: left top;
	padding-bottom: 10px;
}
	
#g248012 #title .fix {
	padding: 10px;
	text-align: center;
}

#g248012 #title .center img {
	width: 90%;	
}
		
#g248012 #title .fix img {
	width: 80px;		
}

#g248012 #title .total {
	font-size: 24px;
	line-height: 1.5em;
}

#g248012 #title .total .block {
	font-size: 20px;
}

#g248012 #title .total .blue {
	font-size: 36px;
}

#g248012 #title .period {
	display: inline-block;
	font-size: 12px;
	padding: 5px 10px;
	margin-top: 10px;
}

#g248012 #title .text {
	margin: 0 10px 0;
	padding: 10px;
}
	
#g248012 .text,
#g248012 #secret_1 dl {
	line-height: 2em;
}
	
#g248012 .box {
	padding: 10px;
}
	
#g248012 .heading {
	margin-bottom: 20px;
}

#g248012 #secret_1 .heading h2 {
	background-position: center top;
	background-size: 80px;
	padding: 90px 0 0;
}
	
#g248012 #secret_2 .heading h2 {
	background-position: center top;
	background-size: 80px;
	padding: 90px 0 0;
}
	
#g248012 #secret_3 .heading h2 {
	background-position: center top;
	background-size: 80px;
	padding: 90px 0 0;
}
	
#g248012 #secret_4 .heading h2 {
	background-position: center top;
	background-size: 80px;
	padding: 90px 0 0;
}
	
#g248012 #secret_5 .heading h2 {
	background-position: center top;
	background-size: 80px;
	padding: 90px 0 0;
}
	
#g248012 h2 {
	font-size: 30px;
	text-align: center;
	font-weight: 300;
}

#g248012 h2 .small {
	font-size: 18px;
}

#g248012 #secret_1 dl {
	padding: 10px;
	margin-bottom: 20px;
}

#g248012 #secret_1 dt {
	font-size: 18px;
}

#g248012 #secret_1 dd {
	font-size: 12px;
}
	
#g248012 #secret_1 div {
	text-align: center;		
}
	
#g248012 #secret_1 #step_1 img,
#g248012 #secret_1 #step_2 img,
#g248012 #secret_1 #step_3 img {
	width: 80%;		
}

#g248012 #secret_1 .text {
	padding: 10px;
}
	
#g248012 #secret_1 .center {
	margin-top: 10px;
	margin-bottom: 10px;
}
	
#g248012 #secret_1 .center img {
	width: 80px;
}
	
#g248012 #secret_2 .fea img {
	width: 80%;		
}
	
#g248012 .colors .maincolor{
    padding:  5px;             /* 余白指定 */
	width: 100%;
	margin-bottom: 20px;
	justify-content: center;
}

#g248012 .colors .color-box{
    padding:  2px;             /* 余白指定 */
    display: flex;              /* フレックスボックスにする */
    flex-wrap: wrap;
	width: 100%; 
	justify-content: center;
}

#g248012 .colors .color-box{
    padding: 2px;
	display: inline-block;
    margin-bottom: 5px;              /* 外側の余白 */
    border-radius: 5px;        /* 角丸指定 */
    width: 48%;                 /* 幅指定 */
	text-align: center;
}

#g248012 .colors p {
	font-size: 14px;
	color: #262626;
	text-align: center;
	line-height: 1.3;
}
	
#g248012 #movie {
	margin-bottom: 50px;
}
	
#g248012 #movie iframe {
	width: 100%;
	height: auto;
}
	
#g248012 #movie p {
	font-size: 11px;
}

}