@charset "shift_jis";

/*==============================================
common
============================================= */
#header {
border-bottom: #ededed solid 1px;
}
.headerIn,
.footerIn {
width: 930px;
margin: 0 auto;
}
.copyRight { border-top: 1px solid #ededed; }
#footer { margin-top: 10px; }
.pageTop { border-radius: 50%; }

.sponly {
    display: none;}

/*---- 文字　 ----*/
#mainContents .paragraph,
#mainContents .mainTitleWrap,
.productBox,
table th,table td{
font-family:'游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-feature-settings: "palt" 1;
letter-spacing: 0.05em;}

#mainContents p {
	font-size:  132%;
	line-height: 1.9;
}

#mainContents .cap{
	font-size: 108%;
	line-height: 1.9;}


#mainContents p + p {
	margin-top: 30px;}

sup {
font-size: 60%;
vertical-align: top;
position: relative;
top: 0.3em;
}

.paragraph .marker {
    font-weight: bold;
    background:linear-gradient(transparent 60%, #c2f6b8 60%);
}

/*==============================================
看板
============================================= */

.mainTitleWrap {
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/bg.png) center top repeat-y;
width: 100%;
margin: 0 auto;
}
.mainTitle {
width: 100%;
margin: 0 auto;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/top_bg.webp) center top no-repeat;
}

h1 {
width: 100%;
height: 620px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/pc_title.png) center 92px no-repeat;
text-indent: -999em;
font-size: 0;
z-index: 1;
}

.lead{
width: 930px;
margin: 0 auto;}

.lead a:link,
.lead a:visited {
    color: #1c8906;
    font-weight: bold;
    text-decoration: underline;
}
.lead a:hover,
.lead a:active {
text-decoration: none;
}

/*　アンカー　*/
.contentsNavi {
width: 930px;
margin: 80px auto 0;
padding-bottom: 80px;
display: table;}

.contentsNavi p,
.contentsNavi ul {
display: table-cell;
vertical-align: top;}

.contentsNavi p{
    text-indent: -999em;
    background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/index_tit.png) left top no-repeat;
    width: 100px;}

.contentsNavi li + li {
    margin-top: 19px;}

.contentsNavi li a {
    display: block;
    font-size: 16px;
    padding-left: 30px;
    min-height: 18px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/arrow.png) left 50% no-repeat;}

.contentsNavi li a:hover {
color: #1c8906;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/arrow_over.png) left 50% no-repeat;}

.contentsNavi li a span {
    font-weight: bold;
    display: inline-block;
    width: 200px;}

/*==============================================
 バナー
============================================= */
.topbnr a,
.topbnr .bnr{margin: 40px auto 0;}

.innerbnr a,
.innerbnr .bnr{margin: 70px auto 100px;}

.topbnr a,
.innerbnr a{
display: block;
width: 780px;
height: 163px;
text-indent: -9999px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/bnner.jpg) left top no-repeat;
overflow: hidden;
transition: 0.1s ease-in-out;}

.topbnr a:hover,
.innerbnr a:hover {
opacity: 0;	}

.topbnr .bnr,
.innerbnr .bnr{
width: 780px;
height: 163px;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/bnner_over.jpg) left top no-repeat;}



/*==============================================
#mainContents
============================================= */
.bggray {
    background-color: #f0f0f0;
    border-bottom: #fff 1px solid;}

.bgwhite {
    background-color: #fff;
    width: 1130px;
    margin: 0 auto;}

.spAccordion {
width: 930px;
margin: 0 auto;}

 #article01 h2,
 #article02 h2,
 #article03 h2 {
    font-size: 29px;
    line-height: 1.8;
    font-weight: bold;
/*    min-height: 316px;*/
    text-align: center;
    padding: 82px 0 60px;
    box-sizing: border-box;
}

 #article01 h2 .h2icon,
 #article02 h2 .h2icon,
 #article03 h2 .h2icon {
    width: 930px;
    margin: 0 auto;
    display: block;}

 #article01 h2 .icon,
 #article02 h2 .icon,
 #article03 h2 .icon {
    display: inline-block;
    background-color: #1d1d1d;
    color: #fff;
    text-align: center;
    padding: 5px 20px;
    font-size: 24px;}

 #article01 h2 .text,
 #article02 h2 .text, 
 #article03 h2 .text {
    display: block;
    padding-top: 25px;
}

#article01{
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/h2_01.webp) center top no-repeat;}
#article02{
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/h2_02.webp) center top no-repeat;}
#article03{
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/h2_03.webp) center top no-repeat;}


/*----　画像　----*/
.w600 {width: 600px;}

.imgBox {margin:90px auto 0;}

.imgBox div {overflow: hidden;}

.imgBox .floatL,
.imgBox .floatR {width:455px;}
.imgBox img {width: 100%;}

.imgBox a {
font-size: 0;
display: block;
cursor: zoom-in;}

.imgBox a img{
transition: 0.1s ease-in-out;}

.imgBox a:hover img {
opacity: 0.8;
filter: alpha(opacity=80);}

.imgBox .cap a {
	font-size: 100% !important;
	display: inline-block !important;
	color: #5a7ddd;
	text-decoration: underline;}

.imgBox div + .cap,
.imgBox a + .cap{
	margin-top: 15px;}

a.floatL + .cap,
a.floatR + .cap{
	margin-top: 0;}

.imgBox + p{
    margin-top: 90px;}

.imgBox.colorBox + .imgBox.colorBox {
    margin-top: 40px;}

.imgBox.colorBox p.colorname {
    border:#1d1d1d 1px solid;
    padding: 2px 0 1px;
    width: 180px;
    font-size: 15px;
    text-align: center;
    margin: 8px auto 0;}

.imgBox.colorBox .cap {
    margin-top: 30px !important;}


/*----　まとめ　----*/
#matome {
padding: 40px 0;
  background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/matome_bg.webp) center top no-repeat;}

#matome h2{
    width: 930px;
    margin: 0 auto;}

#matome h2 .icon{
    display: none;}

#matome h2 .text{
font-size: 29px;
line-height: 1.7;
font-weight: bold;
margin-left: 410px;
width: 520px;
background: rgba(255,255,255,0.7);
display: block;
    padding: 40px 40px 20px;
    box-sizing: border-box;}

#matome .paragraphIn {
    width: 520px;
    background: rgba(255,255,255,0.7);
    padding: 0 40px 40px;
    margin-left: 410px;
    box-sizing: border-box;}

/*==============================================
.productBox
============================================= */
.productBox {
width: 930px;
margin: 80px auto 0;
text-align: center;}

.productBox a{
display: block;
width: 620px;
margin: 0 auto;
transition: 0.1s ease-in-out;}

.productBox a:hover {
opacity: 0.8;
filter: alpha(opacity=80);}

.productBox a .info dt.name {
margin-top: 16px;
text-indent: -999em;
background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/prd_name.png) no-repeat center top;
background-size: 307px;
padding-top: 100px;}

.productBox a .info .btn span{
    background: url(https://img1.kakaku.k-img.com/images/article/tieup/24/10_rakutto/linkicon.png) no-repeat right 50%;
    background-size: 14px;
    padding-right: 18px;}

.productBox a .info .btn {
margin: 0 auto 0;
width: 410px;
font-size: 16px;
padding: 19px 30px 18px;
background:#1c8906;
color: #fff;
text-align:center;
transition: 0.1s ease-in-out;}

.productBox a:hover .info .btn {
background:#76c102;}



/*----　動画へのリンク　----*/
.movielink a{
    width: 680px;
    margin: 90px auto 0;
display: block;
transition: 0.1s ease-in-out;}

.movielink a:hover {
opacity: 0.8;
filter: alpha(opacity=80);}

/*==============================================
.releasedate
============================================= */
.bgwhite .attention {
    width: 930px;
    margin: 50px auto 0;
    font-size: 13px !important;
    line-height: 1.6;
    text-align: right;
}

.releasedate {
font-size: 11px; 
color: #333;
width: 930px;
padding-bottom: 100px;
margin: 60px auto 0; 
text-align: right;}

