@charset "utf-8";

@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);

/* CSS */
* {
    border: 0 none;
    margin: 0;
    padding: 0;
}

html {
    font-size: 62.5%;
}

body {
    font-size: 1.6rem;
    font-size: 16px;
}

html,
body {
    width: 100%;
    margin: 0;
    padding: 0;
    line-height: 1.5;
    color: #000;
    background: #FFF;
    box-sizing: border-box;
    text-align: center;
}

#newlife {
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
    font-weight: 300;
}

/* 画像
============================================*/
img {
    border: none;
    vertical-align: top;
    -ms-interpolation-mode: bicubic;
}

/* 画像透過
============================================*/
a:hover img {
    opacity: 0.8;
    filter: alpha(opacity=80);
    -ms-filter: "alpha( opacity=80 )";
}

/* a
============================================*/
a {
    text-decoration: none;
    color: #000;
}

/* ol,ul,dl
============================================*/
li {
    list-style: none;
}


/* header
============================================*/
header {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
}

/* font color
============================================*/



/* 汎用
============================================*/
/* タブレット and PC */
@media only screen and (min-width: 415px) {
    .tab-pcno {
        display: none;
    }
}

/* スマホ縦向き */
@media only screen and (max-width: 414px) {
    .spno {
        display: none;
    }
}

@media only screen and (min-width: 769px) {
    .pcn {
        display: none;
    }
}

@media only screen and (max-width: 768px) {
    .spn {
        display: none;
    }
}

/* nav
============================================*/
@media only screen and (max-width: 1024px) {
    body > div:first-child {
        padding-top: 50px;
    }
}

#navArea {
    background-color: #f5f5f5;
    /*	background-image:url(img/nav_bg2.jpg);  */
}

#navArea ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    margin: 0 auto;
}

#navArea div {
    background: #FFF;
}

#navArea li a {
    border: solid 2px #000;
}

/* PC 1200px以上 */
@media only screen and (min-width: 1200px) {
    #navArea ul {
        max-width: 1176px;
        padding: 40px 0 24px;
    }

    #navArea li {
        width: 16.666%;
    }

    #navArea div {
        margin: 0 8px 16px;
    }
}

/* PC 1025-1199px */
@media only screen and (min-width: 1025px) and (max-width: 1199px) {
    #navArea ul {
        max-width: 996px;
        padding: 40px 0 24px;
    }

    #navArea li {
        width: 16.666%;
    }

    #navArea div {
        margin: 0 8px 16px;
    }
}

/* ipadPro縦向き-PC 813-1024px */
@media only screen and (min-width: 813px) and (max-width: 1024px) {
    #navArea ul {
        max-width: 790px;
        padding: 40px 0 24px;
    }

    #navArea li {
        width: 25%;
    }

    #navArea div {
        margin: 0 8px 16px;
    }
}

/* ipad縦向き(768) and iphone10横向き and more 812px */
@media only screen and (max-width: 812px) {
    #navArea ul {
        width: 99%;
        padding: 20px 0 10px;
    }

    #navArea li {
        width: 25%;
    }

    #navArea div {
        margin: 0 5px 10px;
    }
}

/* jQ効果
============================================*/
/*
.fade-in {
	opacity:0;
  transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
}
*/
/* section
============================================*/
#coodi h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec02.jpg) no-repeat center top;
}

#season h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec01.jpg) no-repeat center top;
}

#ragmat h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec03.jpg) no-repeat center top;
}

#furniture h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec04.jpg) no-repeat center top;
}

#strage h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec05.jpg) no-repeat center top;
}

#tableware h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec06.jpg) no-repeat center top;
}

#lifeware h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec07.jpg) no-repeat center top;
}

#light h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec08.jpg) no-repeat center top;
}

#fabric h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec09.jpg) no-repeat center top;
}

#interiorAcc h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec10.jpg) no-repeat center top;
}

#bedding h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec11.jpg) no-repeat center top;
}

#floor h2 {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/icon/sec12.jpg) no-repeat center top;
}




#newlife h2 {
    font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif !important;
    display: block;
    line-height: 1.1;
    letter-spacing: 1px;
}

#newlife h2 span {
    display: block;
    font-family: 'Noto Sans JP', sans-serif;
}

/* ipadPro縦向き-PC 813px 以上 */
@media only screen and (min-width: 813px) {
    #firsec {
        padding: 0 0 90px;
    }

    section > section {
        padding: 60px 0 0;
    }

    section > section#new_flyer {
        padding: 0 0 0;
    }

    h2 {
        padding: 100px 10px 15px;
        font-size: 55px;
        background-size: auto 85px !important;
    }

    h2 span {
        font-size: 22px;
    }

    section > section > .p1 {
        margin-bottom: 60px;
        font-size: 18px;
        padding: 0 10px;
    }

    .p2 {
        font-size: 18px;
        padding: 20px 10px;
    }
}

/* ipad縦向き(768) and iphone10横向き and more 812px */
@media only screen and (min-width: 415px) and (max-width: 812px) {
    #firsec {
        padding: 0 0 30px;
    }

    section > section {
        padding: 40px 0 0;
    }

    section > section#new_flyer {
        padding: 0 0 0;
    }

    h2 {
        padding: 100px 0 15px;
        font-size: 46px;
        background-size: 120px auto !important;

    }

    h2 span {
        font-size: 22px;
    }

    section > section > .p1 {
        margin-bottom: 30px;
        font-size: 14px;
    }

    .p2 {
        font-size: 14px;
        padding: 15px 10px;
    }
}

/* スマホ縦向き 414px以下 */
@media only screen and (max-width: 414px) {
    #firsec {
        padding: 0 0 30px;
    }

    section > section {
        padding: 30px 0 0;
    }

    section > section#new_flyer {
        padding: 0 0 0;
    }

    h2 {
        line-height: 1.25;
        padding: 90px 0 15px;
        font-size: 30px;
        background-size: 100px auto !important;

    }

    h2 span {
        font-size: 18px;
    }

    section > section > .p1 {
        margin-bottom: 20px;
        font-size: 14px;
    }

    .p2 {
        font-size: 14px;
        padding: 10px 10px;
    }
}

#pickup {
    max-width: 1000px;
    margin: 0 auto;
    width: 100%;
}

#pickup h2 {
    text-align: center;
    border-bottom: solid 1px #000;
    margin-bottom: 10px;
    /*background: url("img/ttl_contents.gif") no-repeat center top;*/
    padding-top: 40px;
    font-size: 2.8rem;
    font-size: 28px;
    text-align: center;
    letter-spacing: 2px;
    width: 100%;
}

@media only screen and (max-width: 414px) {
    #pickup h2 {
        font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
        font-size: 2.4rem;
        font-size: 24px;
        margin-bottom: 10px;
        background: url("//www.rakuten.ne.jp/gold/asia-kobo/iframe_cate/event/soy/img/ttl/ttl_contents001b.gif") no-repeat center top / 220px auto !important;
        padding-top: 90px;
        width: 100%;
    }
}

.iconArea {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
    box-sizing: border-box;
}

.iconArea li {
    width: 10.2%;
    margin-bottom: 10px;
}

/* h2 section毎のメイン画像
----------------------------------*/
#furniture .imgFrame {
    background: url(img/cate_top_024.jpg) no-repeat;
}

#ragmat .imgFrame {
    background: url(img/cate_top_026.jpg) no-repeat;
}

#strage .imgFrame {
    background: url(img/cate_top_019.jpg) no-repeat;
}

#tableware .imgFrame {
    background: url(img/cate_top_003.jpg) no-repeat;
}

#lifeware .imgFrame {
    background: url(img/cate_top_023.jpg) no-repeat;
}

#light .imgFrame {
    background: url(img/cate_top_025b.jpg) no-repeat;
}

#fabric .imgFrame {
    background: url(img/cate_top_022.jpg) no-repeat;
}

#interiorAcc .imgFrame {
    background: url(img/cate_top_021.jpg) no-repeat;
}

#floor .imgFrame {
    background: url(img/newlife33.jpg) no-repeat;
}

#bedding .imgFrame {
    background: url(img/cate_top_017.jpg) no-repeat
}

#season .imgFrame {
    background: url(img/cate_top_020.jpg) no-repeat
}

/* 背景サイズ調節 PC */
@media only screen and (min-width: 813px) {
    #furniture .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

    #ragmat .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

    #strage .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

    #tableware .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

    #lifeware .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

    #light .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

    #fabric .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

    #interiorAcc .imgFrame {
        background-size: 1920px auto;
        background-position: center 45%;
    }

    #floor .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

    #bedding .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

    #season .imgFrame {
        background-size: 1920px auto;
        background-position: center center;
    }

}

@media only screen and (min-width: 1921px) {
    #furniture .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #ragmat .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #strage .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #tableware .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #lifeware .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #light .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #fabric .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #interiorAcc .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #floor .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #bedding .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }

    #season .imgFrame {
        background-size: 100% auto;
        background-position: center center;
    }
}

/* 背景サイズ調節 ipad縦向き(768) and iphone10横向き and more 812px */
@media only screen and (min-width: 415px) and (max-width: 812px) {
    #furniture .imgFrame {
        background-size: 160% auto;
        background-position: center center;
    }

    #ragmat .imgFrame {
        background-size: 150% auto;
        background-position: center top 30%;
    }

    #strage .imgFrame {
        background-size: 120% auto;
        background-position: center center;
    }

    #tableware .imgFrame {
        background-size: 110% auto;
        background-position: center center;
    }

    #lifeware .imgFrame {
        background-size: 116% auto;
        background-position: 67% 44%;
    }

    #light .imgFrame {
        background-size: 150% auto;
        background-position: center center;
    }

    #fabric .imgFrame {
        background-size: 104% auto;
        background-position: center 55%;
    }

    #interiorAcc .imgFrame {
        background-size: 104% auto;
        background-position: center 45%;
    }

    #floor .imgFrame {
        background-size: 160% auto;
        background-position: center center;
    }

    #bedding .imgFrame {
        background-size: 104% auto;
        background-position: center center;
    }

    #season .imgFrame {
        background-size: 125% auto;
        background-position: center center;
    }
}

/* 背景サイズ調節 スマホ縦向き 414px以下 */
@media only screen and (max-width: 414px) {
    #furniture .imgFrame {
        background-size: 130% auto;
        background-position: center 48%;
    }

    #ragmat .imgFrame {
        background-size: 150% auto;
        background-position: center center;
    }

    #strage .imgFrame {
        background-size: 150% auto;
        background-position: center center;
    }

    #tableware .imgFrame {
        background-size: 127% auto;
        background-position: 63% 60%;
    }

    #lifeware .imgFrame {
        background-size: 145% auto;
        background-position: center center;
    }

    #light .imgFrame {
        background-size: 150% auto;
        background-position: 50% 65%;
    }

    #fabric .imgFrame {
        background-size: 120% auto;
        background-position: center 0%;
    }

    #interiorAcc .imgFrame {
        background-size: 142% auto;
        background-position: center 44%;
    }

    #floor .imgFrame {
        background-size: 200% auto;
        background-position: center center;
    }

    #bedding .imgFrame {
        background-size: 125% auto;
        background-position: center 70%;
    }

    #season .imgFrame {
        background-size: 150% auto;
        background-position: 35% 40%;
    }
}

.imgFrame {
    width: 100%;
    overflow: hidden;
}

/* PC */
@media only screen and (min-width: 813px) {
    .imgFrame {
        height: 690px;
    }
}

/* ipad縦向き(768) and iphone10横向き and more 812px */
@media only screen and (min-width: 415px) and (max-width: 812px) {
    .imgFrame {
        max-height: 400px;
        height: 30vh;
    }
}

/* スマホ縦向き 414px以下 */
@media only screen and (max-width: 414px) {
    .imgFrame {
        height: 250px;
    }
}

/* main
----------------------------------*/
#main {
    background: url(img/main_002.jpg) no-repeat;
    box-sizing: border-box;
    width: 100%;
    display: table;
}

/* 背景サイズ調節 PC */
@media only screen and (min-width: 813px) {
    #main {
        background-size: 1920px auto;
        background-position: center center;
    }
}

@media only screen and (min-width: 1921px) {
    #main {
        background-size: 110% auto;
        background-position: center center;
    }
}

/* 背景サイズ調節 ipad縦向き(768) and iphone10横向き and more 812px */
@media only screen and (min-width: 415px) and (max-width: 812px) {
    #main {
        background-size: 140% auto;
        background-position: 30% 48%;
    }
}

/* 背景サイズ調節 スマホ縦向き 414px以下 */
@media only screen and (max-width: 414px) {
    #main {
        background-size: 200% auto;
        background-position: 38% 45%;
    }
}

/* PC */
@media only screen and (min-width: 813px) {
    #main {
        height: 716px;
    }

    #main h1 span {
        padding: 14px 14px 14px 14px;
        /* 20px 20px 14px 20px */
        width: 50%;
        max-width: 580px;
        /* 580px */
    }

    #main h1 img {
        max-width: 523px;
        /* 523px */
    }
}

/* ipad縦向き(768) and iphone10横向き and more 812px */
@media only screen and (min-width: 415px) and (max-width: 812px) {
    #main {
        height: 400px;
    }

    #main h1 span {
        padding: 10px 0 14px 0;
        width: 20%;
        min-width: 280px;
    }

    #main h1 img {
        width: 80%;
    }
}

/* スマホ縦向き 414px以下 */
@media only screen and (max-width: 414px) {
    #main {
        height: 300px;
    }

    #main h1 span {
        padding: 10px 10px 10px 10px;
        width: 60%;
        /* 70% */
        font-size: 16px;
        letter-spacing: 1px;
    }

    /*#main h1 img {
	width:80%;
}*/
}

#main h1 {
    display: table-cell;
    box-sizing: border-box;
    margin: 0 auto;
    text-align: left;
    vertical-align: middle;
}

#main h1 span {
    background-color: rgba(154, 144, 95, 0.70);
    /*	background-image:url(img/ttl_bg.png) ; background-repeat:no-repeat;*/
    color: #000;
    display: block;
    margin: 0 auto;
    text-align: center;
    box-sizing: border-box;
}

#main h1 img {
    /*	padding-left:7.241%;*/
    box-sizing: border-box;
}

/* 特集や商品紹介のリスト部分
----------------------------------*/
.clist,
.clist2,
.clist3 {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    padding-top: 60px;
    max-width: 1200px;
    margin: 0 auto;
}

.clist h3,
.clist h3 span {
    display: block;
    font-weight: bold;
    line-height: 1.2;
}

.clist2 {
    text-align: left;
}

.clist2 li,
.clist2 p,
.clist2 p strong {
    display: block;
}

.clist2 p {
    font-weight: 100;
}

.linkBtn a {
    width: 80%;
    max-width: 350px;
    border: solid 2px #000;
    margin-left: auto;
    margin-right: auto;
    font-weight: bold;
}

.linkBtn a:hover {
    color: #FFF;
    border: solid 2px #d8d4cb;
    background-color: #d8d4cb;
    transition: 0.3s;
    -moz-transition: 0.3s;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
}

/* スマホ縦向き 以上 */
@media only screen and (min-width: 415px) {
    .clist {
        padding: 60px 0 0;
    }

    .clist3 {
        padding: 60px 0 0;
    }

    .clist > section {
        width: 33.333%;
    }

    .clist3 > section {
        width: 50%;
    }

    .clist > section,
    .clist3 > section {
        padding: 0 0 40px;
    }

    .clist > section:nth-last-of-type(-n+3) {
        padding-bottom: 0;
    }

    .clist > section:nth-child(3n+1) a {
        margin: 0 14px 0 0;
    }

    .clist > section:nth-child(3n+2) a {
        margin: 0 7px 0;
    }

    .clist > section:nth-child(3n+3) a {
        margin: 0 0 0 14px;
    }

    .clist3 > section:nth-last-of-type(-n+2) {
        padding-bottom: 0;
    }

    .clist3 > section:nth-child(2n+1) a {
        margin: 0 10px 0 0;
    }

    .clist3 > section:nth-child(2n+2) a {
        margin: 0 0 0 10px;
    }

    .clist h3,
    .clist3 h3 {
        font-size: 18px;
        margin-bottom: 15px;
    }

    .clist h3 span,
    .clist3 h3 span {
        font-size: 22px;
    }

    .clist section img,
    .clist3 section img {
        margin-bottom: 15px;
    }

    .clist2.clm4 > li {
        width: 25%;
    }

    .clist2.clm3 > li {
        width: 33.333%;
    }

    .clist2 > li {
        padding: 0 0 40px;
    }

    .clist2.clm4 > li:nth-last-of-type(-n+4) {
        padding-bottom: 0;
    }

    .clist2.clm4 > li:nth-child(4n+1) a {
        margin: 0 15px 0 0;
    }

    .clist2.clm4 > li:nth-child(4n+2) a {
        margin: 0 10px 0 5px;
    }

    .clist2.clm4 > li:nth-child(4n+3) a {
        margin: 0 5px 0 10px;
    }

    .clist2.clm4 > li:nth-child(4n+4) a {
        margin: 0 0 0 15px;
    }

    .clist2.clm3 > li:nth-child(3n+1) a {
        margin: 0 14px 0 0;
    }

    .clist2.clm3 > li:nth-child(3n+2) a {
        margin: 0 7px 0;
    }

    .clist2.clm3 > li:nth-child(3n+3) a {
        margin: 0 0 0 14px;
    }

    .clist2 p {
        font-size: 15px;
    }

    .clist2 p strong {
        font-size: 18px;
    }

    .clist2 p strong span {
        font-size: 14px;
    }

    /* 20200120 追加 */
    .clist2.clm5 > li {
        width: 20%;
    }

    .clist2.clm5 > li:nth-last-of-type(-n+5) {
        padding-bottom: 0;
    }

    .clist2.clm5 > li:nth-child(5n+1) a {
        margin: 0 20px 0 0;
    }

    .clist2.clm5 > li:nth-child(5n+2) a {
        margin: 0 15px 0 5px;
    }

    .clist2.clm5 > li:nth-child(5n+3) a {
        margin: 0 10px 0 10px;
    }

    .clist2.clm5 > li:nth-child(5n+4) a {
        margin: 0 5px 0 15px;
    }

    .clist2.clm5 > li:nth-child(5n+5) a {
        margin: 0 0 0 20px;
    }

    /* 20200120 追加 ここまで */

    .linkBtn {
        padding: 50px 0 0;
    }

    .linkBtn a {
        font-size: 18px;
        padding: 20px;
        background: url(img/arrow001.svg) no-repeat right 20px center / auto 18px;
    }

    .linkBtn a:hover {
        background: url(img/arrow008.png) no-repeat right 20px center / auto 18px #d8d4cb;
    }
}

/* スマホ縦向き 414px以下 */
@media only screen and (max-width: 414px) {

    .clist,
    .clist3 {
        padding: 20px 10px 0;
    }

    .clist > section,
    .clist3 > section {
        width: 50%;
    }

    .clist > section,
    .clist3 > section {
        padding: 0 0 15px;
    }

    .clist > section:nth-last-of-type(-n+2) {
        padding-bottom: 0;
    }

    .clist > section:nth-child(2n+1) a,
    .clist3 > section:nth-child(2n+1) a {
        margin: 0 5px 0 0;
    }

    .clist > section:nth-child(2n+2) a,
    .clist3 > section:nth-child(2n+2) a {
        margin: 0 0 0 5px;
    }

    .clist h3,
    .clist3 h3 {
        font-size: 3.2vw;
        margin-bottom: 10px;
    }

    .clist h3 span,
    .clist3 h3 span {
        font-size: 3.75vw;
    }

    .clist section img,
    .clist3 section img {
        margin-bottom: 10px;
    }

    .clist section p,
    .clist3 section p {
        text-align: left;
        font-size: 11px;
    }

    .clist2 {
        padding: 20px 10px 0;
    }

    .clist2 > li {
        width: 50%;
        padding: 0 0 15px;
    }

    .clist2 > li:nth-last-of-type(-n+2) {
        padding-bottom: 0;
    }

    .clist2 > li:nth-child(odd) a {
        margin: 0 5px 0 0;
    }

    .clist2 > li:nth-child(even) a {
        margin: 0 0 0 5px;
    }

    .clist2 p {
        font-size: 12px;
    }

    .clist2 p strong {
        font-size: 14px;
    }

    .clist2 p strong span {
        font-size: 10px;
    }

    .clist2.sclm3 > li {
        width: 33.333%;
    }

    .clist2.sclm3 > li:nth-child(3n+1) a {
        margin: 0 6px 0 0;
    }

    .clist2.sclm3 > li:nth-child(3n+2) a {
        margin: 0 3px 0;
    }

    .clist2.sclm3 > li:nth-child(3n+3) a {
        margin: 0 0 0 6px;
    }



    .linkBtn {
        padding: 30px 0 0;
    }

    .linkBtn a {
        width: 100%;
        font-size: 16px;
        max-width: 300px;
        padding: 15px 30px 15px 15px;
        background: url(img/arrow001.svg) no-repeat right 15px center / auto 18px;
        box-sizing: border-box;
    }

    .linkBtn a:hover {
        background: url(img/arrow008.png) no-repeat right 15px center / auto 18px #d8d4cb;
    }
}

/* ipad縦向き(768) and iphone10横向き and more 812px */
@media only screen and (min-width: 415px) and (max-width: 812px) {

    .clist,
    .clist3 {
        padding: 20px 10px 0;
    }

    .clist h3,
    .clist3 h3 {
        font-size: 2.5vw;
        margin-bottom: 10px;
    }

    .clist h3 span,
    .clist3 h3 span {
        font-size: 2.75vw;
    }

    .clist section p,
    .clist3 section p {
        text-align: left;
        font-size: 12px;
    }

    .clist2 {
        padding: 20px 10px 0;
    }

    .clist2 > li {
        padding: 0 0 15px;
    }

    .clist2 > li:nth-last-of-type(-n+4) {
        padding-bottom: 0;
    }

    .clist2.clm4 > li:nth-child(4n+1) a {
        margin: 0 7px 0 0;
    }

    .clist2.clm4 > li:nth-child(4n+2) a {
        margin: 0 5px 0 2px;
    }

    .clist2.clm4 > li:nth-child(4n+3) a {
        margin: 0 3px 0 4px;
    }

    .clist2.clm4 > li:nth-child(4n+4) a {
        margin: 0 0 0 7px;
    }

    .clist2.clm3 > li:nth-child(3n+1) a {
        margin: 0 6px 0 0;
    }

    .clist2.clm3 > li:nth-child(3n+2) a {
        margin: 0 3px 0;
    }

    .clist2.clm3 > li:nth-child(3n+3) a {
        margin: 0 0 0 6px;
    }

    .clist2 p {
        font-size: 12px;
    }

    .clist2 p strong {
        font-size: 14px;
    }

    .clist2 p strong span {
        font-size: 10px;
    }
}



/* トップあたり
============================================*/
.sen {
    line-height: 1.7;
}

/* スマホ縦向き 以上 */
@media only screen and (min-width: 415px) {
    .sen {
        padding: 30px 10px 30px;
        font-size: 18px;
        background-color: #f5f5f5;
    }
}

/* スマホ縦向き 414px以下 */
@media only screen and (max-width: 414px) {
    .sen {
        padding: 20px 10px 10px;
        font-size: 15px;
        background-color: #f5f5f5;
    }
}

/* 01コーディネート
============================================*/
#coodi .clist p {
    text-align: left;
}

/* 1025px 以上 */
@media only screen and (min-width: 1025px) {
    #coodi .clist a > span {
        overflow: hidden;
        height: 337px;
        display: block;
    }

    #coodi .clist a:hover > span img {
        width: 115%;
        transition: 0.3s;
        -moz-transition: 0.3s;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        text-align: center;
        margin-top: -8%;
        margin-left: -8%;
        opacity: 10;
        filter: alpha(opacity=100);
        -ms-filter: "alpha( opacity=100 )";
    }
}

/* floor
============================================*/
#floor section:first-of-type {
    padding-top: 0;
}

.nav2 ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
}

.nav2 li:nth-child(1) {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/newlife38.jpg) no-repeat;
}

.nav2 li:nth-child(2) {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/newlife39.jpg) no-repeat;
}

.nav2 li:nth-child(3) {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/newlife40.jpg) no-repeat;
}

.nav2 li:nth-child(4) {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/newlife/newlife41.jpg) no-repeat;
}

.nav2 ul li a {
    border: solid 2px #000;
    text-align: center;
}

.nav2 ul li strong {
    font-weight: bold;
    display: block;
}

/* ipad縦向き(768) and iphone10横向き and more 812px 以上 */
@media only screen and (min-width: 812px) {
    #floor section {
        padding-top: 90px;
    }

    .nav2 ul {
        padding: 60px 0 85px 0;
    }

    .nav2 ul li {
        width: 25%;
        background-size: auto 40px !important;
        background-position: center top 20px !important;
        font-size: 18px;
        padding-bottom: 10px;
    }

    .nav2 ul li strong {
        font-size: 22px;
    }

    .nav2 ul li a {
        padding: 70px 10px 0;
    }

    .nav2 ul li:nth-child(4n+1) a {
        margin: 0 15px 0 0;
    }

    .nav2 ul li:nth-child(4n+2) a {
        margin: 0 10px 0 5px;
    }

    .nav2 ul li:nth-child(4n+3) a {
        margin: 0 5px 0 10px;
    }

    .nav2 ul li:nth-child(4n+4) a {
        margin: 0 0 0 15px;
    }
}

/* ipad縦向き(768) and iphone10横向き and more 812px未満 */
@media only screen and (max-width: 811px) {
    #floor section {
        padding-top: 60px;
    }

    .nav2 ul {
        padding: 20px 10px 50px;
    }

    .nav2 ul li {
        width: 50%;
        background-size: auto 25px !important;
        background-position: center top 10px !important;
        font-size: 16px;
        padding-bottom: 10px;
    }

    .nav2 ul li strong {
        font-size: 20px;
    }

    .nav2 ul li a {
        padding: 35px 10px 0;
    }

    .nav2 ul li:nth-last-of-type(-n+2) {
        padding-bottom: 0;
    }

    .nav2 ul li:nth-child(odd) a {
        margin: 0 5px 0 0;
    }

    .nav2 ul li:nth-child(even) a {
        margin: 0 0 0 5px;
    }
}

/* スマホ以下 */
@media only screen and (max-width: 414px) {
    #floor section {
        padding-top: 50px;
    }

    .nav2 ul li strong {
        font-size: 13px;
    }

    .nav2 ul li {
        font-size: 12px;
    }
}

/* 561px以上 */
@media only screen and (min-width: 561px) {
    .br560 {
        display: none;
    }
}

/* floorBox
-----------------------------*/
.floorBox {
    max-width: 1200px;
    margin: 0 auto;
}

.floorBox h3 {
    display: table;
    font-weight: bold;

}

.floorBox h3 > strong {
    display: table-cell;
    width: 28.75%;
    vertical-align: bottom;
    background-color: #f2f2f2 !important;
}

.floorBox h3 > strong > span {
    display: block;
    box-sizing: border-box;
}

.floorBox h3 > span {
    display: table-cell;
    width: 71.25%;
}

#floor > section:nth-of-type(1) h3 > strong > span {
    background: url(img/newlife43.png) no-repeat;
}

#floor > section:nth-of-type(2) h3 > strong > span {
    background: url(img/newlife43-2.png) no-repeat;
}

#floor > section:nth-of-type(3) h3 > strong > span {
    background: url(img/newlife46.png) no-repeat;
}

#floor > section:nth-of-type(4) h3 > strong > span {
    background: url(img/newlife49.png) no-repeat;
}

#floor > section:nth-of-type(5) h3 > strong > span {
    background: url(img/newlife52.png) no-repeat;
}

.floorBox .flBox dl {
    display: table;
}

.floorBox dt {
    padding: 3px;
    background: #f2f2f2;
    display: table-cell;
    vertical-align: middle;
}

.floorBox dd {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
}

/* PC */
@media only screen and (min-width: 1025px) {
    .floorBox h3 > strong {
        font-size: 30px !important;
    }

    .floorBox h3 > strong > span {
        font-size: 18px !important;
    }
}

/* 813以上 */
@media only screen and (min-width: 813px) {
    .floorBox .flBox dl {
        width: 48%;
    }

    .floorBox dt {
        font-size: 22px;
    }

    .floorBox dd {
        padding: 5px;
        font-size: 40px;
    }

    .floorBox dd span {
        font-size: 18px;
    }
}

/* 812以下 */
@media only screen and (max-width: 812px) {
    .floorBox .flBox dl {
        width: 90%;
        margin-bottom: 10px;
    }

    .floorBox dt {
        width: 130px;
        font-size: 18px;
    }

    .floorBox dd {
        padding: 5px;
        font-size: 22px;
    }

    .floorBox dd span {
        font-size: 14px;
    }
}

/* スマホ以上 */
@media only screen and (min-width: 415px) {
    .floorBox h3 > strong {
        font-size: 2.5vw;
    }

    .floorBox h3 > strong > span {
        font-size: 1.6vw;
        padding: 30% 0 0;
        background-size: auto 55% !important;
        background-position: center bottom 60% !important;
    }

    .floorBox .flBox {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
        max-width: 800px;
        margin: 0 auto;
        justify-content: center;
        box-sizing: border-box;
    }

    .flBox.flClm1 dl {
        width: 90% !important;
    }
}

/* スマホ以下 */
@media only screen and (max-width: 414px) {
    .floorBox h3 > strong {
        font-size: 3vw;
    }

    .floorBox h3 > strong > span {
        font-size: 1.75vw;
        padding: 30% 0 0;
        background-size: auto 35% !important;
        background-position: center bottom 70% !important;
    }

    .floorBox .flBox {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 90%;
        max-width: 1200px;
        margin: 0 auto;
        justify-content: center;
        box-sizing: border-box;
    }
}

/* bottom Navi
============================================*/
#btmNav.op {
    opacity: 1;
}

#btmNav {
    opacity: 0;
    background: #d8d4cb;
    padding: 10px 10px;
    position: fixed;
    bottom: 0;
    width: 100%;
    box-sizing: border-box;
    z-index: 9999;
}

#btmNav ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    justify-content: space-between;
    box-sizing: border-box;
}

#btmNav li {
    width: 8%;
}

#btmNav li a {
    margin: 0;
    border: solid 2px #000;
}

#btmNav div {
    background: #FFF;
}

/* ipadPro縦向き-PC 813px 以上 */
@media only screen and (min-width: 813px) {
    .no813 {
        display: none;
    }
}

/* 812px 以下 */
@media only screen and (max-width: 812px) {
    .no812 {
        display: none;
    }

    #btmNavSp.op {
        opacity: 1;
    }

    #btmNavSp {
        opacity: 0;
        background: #d8d4cb;
        position: fixed;
        bottom: 0;
        width: 100%;
        box-sizing: border-box;
        z-index: 9999;
    }

    #btmNavSp ul {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        width: 100%;
        margin: 0 auto;
        justify-content: space-between;
        box-sizing: border-box;
        color: #FFF;
        height: 80px;
    }

    #btmNavSp li.btmclm2 {
        width: 28.5714% !important
    }

    #btmNavSp li {
        width: 14.285%;
        border-bottom: solid 1px #FFF;
        display: table;
        font-weight: bold;
    }

    #btmNavSp li a {
        color: #FFF;
        line-height: 1.3;
        font-size: 12px;
    }

    #btmNavSp li:first-child div,
    #btmNavSp li:nth-last-of-type(7) div {
        border-left: none;
    }

    #btmNavSp li div {
        border-left: dotted 1px #FFF;
        display: table-cell;
        vertical-align: middle;
        height: 40px;
    }

}

#goTop.op {
    opacity: 1;
    z-index: 9;
}

#goTop {
    opacity: 0;
}

/* ipadPro縦向き-PC 813px 以上 */
@media only screen and (min-width: 813px) {
    #goTop {
        width: 60px;
        height: 60px;
        box-sizing: border-box;
        position: fixed;
        bottom: 100px;
        right: 25px;
        border: solid 2px #000;
        padding: 15px;
        background-color: rgba(255, 255, 255, 0.6);
    }
}

@media only screen and (max-width: 812px) {
    #goTop {
        width: 40px;
        height: 40px;
        box-sizing: border-box;
        position: fixed;
        bottom: 90px;
        right: 15px;
        border: solid 2px #000;
        padding: 10px;
        background-color: rgba(255, 255, 255, 0.6);
    }
}

.single-item {
    max-width: 1200px;
    margin: 0 auto;
}

/* loopslider
============================================*/
#loopTtl {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
}

#loopTtl p {
    position: absolute;
    font-style: italic;
    z-index: 1;
    font-weight: bold;
    padding-left: 10px;
}

/* ipadPro縦向き-PC 813px 以上 */
@media only screen and (min-width: 813px) {
    #loopTtl p {
        font-size: 40px;
        top: -47px;
    }

    #loop {
        padding-top: 47px;
    }

    #loopslider ul {
        height: 267px;
    }

    #loopslider ul li {
        width: 400px;
    }

    #loopslider {
        height: 267px;
    }
}

/* 812px 以下 */
@media only screen and (max-width: 812px) {
    #loopTtl p {
        font-size: 20px;
        top: -23px;
    }

    #loop {
        padding-top: 23px;
    }

    #loopslider ul {
        height: 133px;
    }

    #loopslider ul li {
        width: 200px;
    }

    #loopslider {
        height: 150px;
    }
}

#loopslider {
    margin: 0 auto;
    width: 100%;
    text-align: left;
    position: relative;
    overflow: hidden;
}

#loopslider ul {
    float: left;
    display: inline;
    overflow: hidden;
}

#loopslider ul li {
    float: left;
    display: inline;
    overflow: hidden;
}

#loopslider_wrap:after,
#loopslider ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden;
}

#loopslider ul {
    display: inline-block;
    overflow: hidden;
    float: left;
}

#loopslider_wrap {
    width: 100%;
}

/* slick
============================================*/
@media only screen and (min-width: 813px) {
    .slick1 .slick-next {
        background: url(img/arrow005.svg) no-repeat right center / auto 40px;
        width: 30px;
        height: 40px;
        right: 25px;
    }

    .slick1 .slick-prev {
        background: url(img/arrow004.svg) no-repeat left center / auto 40px;
        width: 30px;
        height: 40px;
        left: 25px;
        z-index: 1;
    }
}

@media only screen and (max-width: 812px) {
    .slick1 .slick-next {
        background: url(img/arrow005.svg) no-repeat right center / 20px auto;
        width: 30px;
        height: 40px;
        right: 15px;
    }

    .slick1 .slick-prev {
        background: url(img/arrow004.svg) no-repeat left center / 20px auto;
        width: 30px;
        height: 40px;
        left: 15px;
        z-index: 1;
    }
}


/* footer
============================================*/
footer {}

#footer {
    text-align: left;
    width: 1000px;
    height: auto;
}


#footer .sub_title {
    width: 1000px;
    border-bottom: #ccc solid 1px;
    height: 24px;
    margin: 20px 0 30px 0;
    text-align: left;
    padding: 8px 0 16px 0;
    /* font-size: 150%; 21px */
    font-weight: bold;
}

/* footer 上部ナビ一覧 */

#footer_navi {
    margin: 30px 0 50px 0;
    overflow: hidden;

}

#footer_navi dl {
    float: left;
    width: 212px;
    margin-left: 50px;
}

#footer_navi dl:first-child {
    width: 450px;
    margin-left: 0;
}


#footer_navi dt {
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-size: 134%;
    font-weight: bold;
    border-bottom: 1px solid #ccc;
}

#footer_navi dd {
    float: left;
    margin-top: 1em;
    width: 100%;
}

#footer_navi dl:first-child dd {
    width: 50%;
}

#footer_navi dd a {
    display: block;
}

#footer_navi dd a:hover {
    text-decoration: underline;
}


/* footer 下部分 */

#footer_under {
    width: 1000px;
    height: auto;
    margin: 0;
    line-height: 18px;
}

#footer_under .text {
    font-size: 85%;
    line-height: 1.8;
    margin-bottom: 14px;
}

#footer .min_title {
    font-size: 104%;
    background: url(../img/arrow.gif) no-repeat;
    background-position: left center;
    padding: 0 0 0 10px;
    font-weight: bold;
    margin: 2px 0 4px 0;
}

#footer .left {
    width: 306px;
    height: auto;
    margin: 0 20px 0 20px;
    float: left;
}

#footer .center {
    width: 306px;
    height: auto;
    margin: 0 20px 0 0;
    float: left;
}

#footer .right {
    width: 306px;
    height: auto;
    margin: 0 20px 0 0;
    float: right;
}

#footer_title {
    width: auto;
    margin: 0 0 10px 0;
    padding: 2px 0 2px 0;
    font-size: 120%;
    font-weight: bold;
    border-bottom: 1px dotted #ccc;
}

#recommend h3 {
    text-align: center;
    padding: 5px 0;
    border-top: solid 1px #000;
    border-bottom: solid 1px #000;
    margin: 50px 0 10px;
    font-size: 2.4rem;
}

.copyright {
    width: 100%;
    text-align: center;
    font-size: 90%;
    line-height: 1.6;
    margin-bottom: 14px;
}

.menuCate {
    width: 100%;
}

/* 1025px以上 */
@media only screen and (min-width: 1025px) {
    footer {
        width: 1000px;
        margin: 0 auto 100px;
    }

    #ftMenu .sptbno {
        display: none;
    }
}

/* 1024px以下 */
@media only screen and (max-width: 1024px) {
    #ftMenu .pcno {
        display: none;
    }

    #ftMenu {
        margin-bottom: 100px;
    }
}

/* 20180614 SS差し込み coupon
----------------------------------*/
#coupon h4 {
    text-align: center;
    font-size: 2.8rem;
    font-weight: bold;
    font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif !important;
}

#coupon h4 strong {
    font-size: 3.4rem;
    color: #000;
    line-height: 1.8;
}

#coupon a {
    width: 100%;
    margin: 0 auto 15px;
    text-align: center;
}

#coupon div.col2 > div {
    width: 50%;
    float: left;
}

#coupon div.col2 div:nth-child(odd) div {
    padding-right: 5px;
}

#coupon div.col2 div:nth-child(even) div {
    padding-left: 5px;
}

/* SPのみ */
@media only screen and (max-width: 767px) {
    #coupon h4 {
        font-size: 5vw;
    }

    #coupon h4 strong {
        font-size: 5.625vw;
    }

    #coupon div.col2 div:nth-child(odd) div {
        padding-right: 2px;
    }

    #coupon div.col2 div:nth-child(even) div {
        padding-left: 2px;
    }

}

/* SPECIAL MAGAZINE
============================================*/
#new_flyer {
    max-width: 1000px;
    margin: auto;
}

#new_flyer img {
    max-width: 100%;
}

#firsec .sub_title {
    font-family: adobe-caslon-pro, serif;
    font-weight: 400;
    font-style: normal;
    font-size: 1.5em;
    max-width: 1000px;
    display: block;
    margin: 4em auto 2em;
    border-bottom: 1px solid #e6e6e6;
    line-height: 1em;
    padding: 0 1em 0.5em;
    text-align: left;
}

#firsec #bn_back a {
    background: #efefef;
    display: inline-block;
    padding: 0.5em 2em;
    border-radius: 100px;
    font-size: small;
    margin: 1em 0 3em;
    transition: 0.2s;
}

#firsec #bn_back a:hover {
    background: #dcdcdc;
}

#bn_list {
    clear: both;
    width: 1000px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

#bn_list li {
    width: calc(100% / 4 - 10px);
    margin: 5px;
    border: 1px solid #ccc;
}

/* SPのみ */
@media only screen and (max-width: 767px) {
    #firsec .sub_title {
        font-family: adobe-caslon-pro, serif;
        font-weight: 400;
        font-style: normal;
        font-size: 1.5em;
        vertical-align: bottom;
        display: block;
        margin: 2em auto 1em;
        border-bottom: 1px solid #e6e6e6;
        line-height: 1em;
        padding: 0 1em 0.5em;
        text-align: center;
    }

    #bn_list {
        clear: both;
        width: 100%;
    }

    #bn_list li {
        width: calc(100% / 2 - 10px);
        margin: 5px;
        border: 1px solid #ccc;
    }

}


/* RANKING
============================================*/
#rankingList {
    width: 1000px;
    margin: 0 auto;
    padding: 0;
}

@media only screen and (max-width: 1024px) {
    #rankCateList {
        margin: 0 auto;
        padding: 0;
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        overflow-scrolling: touch;
        -webkit-overflow-scrolling: touch;
        position: fixed;
        left: 0;
        bottom: 0;
        background: #967a48;
        padding: 0 10px;
        z-index: 999;
    }

    #rankCateList li {
        display: inline-block;
        list-style: none;
        margin-right: 0.5em;
    }

    #rankCateList li a {
        padding: 0.4em 2em;
        border-radius: 100px;
        background: #fff;
        margin: 0.4em 0;
    }

    #rankCateList li a br {
        display: none;
    }
    .rank_cateTitle{
        padding-top: 10vh;
        margin-top: -10vh;
    }
}

@media only screen and (min-width: 1024px) {
    #rankCateList {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 2em;
    }

    #rankCateList li {
        display: flex;
        align-items: center;
        width: calc(100% / 4 - 10px);
        margin: 0 0 10px;
        background: #e4dcc6;
        line-height: 1;
        height: 3.5em;
    }

    #rankCateList li:hover {
        background: #977a4b;
    }

    #rankCateList li a {
        display: block;
        width: 100%;
        padding: 10px;
        font-weight: bold;
    }

    #rankCateList li:hover a {
        color: #fff;
    }
}

#rankingList .rankBtn {
    display: block;
    width: 80%;
    border: 3px solid #000;
    margin: 0 auto 4em;
    font-size: 1.5em;
    line-height: 1.2;
    padding: 0.8em 2em;
    font-weight: bold;
}

.r1box {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.r1-bg {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/event/rank/rank_1909_r31.jpg) no-repeat 0 0;
    width: 100%;
    height: 497px
}

.r1-img {
    padding: 1px 0 0 1px;
    width: 495px;
}

.r1-txt {
    width: 500px;
    padding: 150px 0 0;
    letter-spacing: 2px;
}

.r-btn {
    width: 70%;
    padding: 10px;
    margin: 15px auto 25px;
    background-color: #967a48;
    text-align: center;
    color: #fff;
    font-size: 19px;
}

.r-btn::after {
    content: "はこちら →";
}

.r3box {
    width: 100%;
    margin-bottom: 20px;
}

.r3box.r2box {
    width: 100%;
    margin: 0 auto 4em;
}

.r3box.pickUp {
    width: 100%;
    margin: 2em auto 4em;
}

.r3box ul {
    display: flex;
    justify-content: space-between;
}

.r3box ul li {
    width: calc(100% / 3 - 10px);
    border: solid 1px #ccc;
}

.r3box.r2box ul li {
    width: calc(100% / 2 - 10px);
    border: solid 1px #ccc;
}

.r3box img {
    width: 100%;
}

.r3-txt {
    padding: 20px 0 0;
    text-align: center;
    font-size: 1.1em;
    font-weight: bold;
}

@media only screen and (max-width: 1024px) {
    #rankingList {
        width: 98%;
    }

    #rankingList .gothic1 {
        font-size: 1.3em !important;
    }

    #rankingList .gothic1 br {
        display: none;
    }

    #rankingList .rankBtn {
        width: 90%;
        font-size: 1em;
        padding: 0.8em 2em;
    }

    .r1box {
        display: block;
        height: auto;
    }

    .r1-bg {
        background: none;
        width: 100%;
        position: relative;
        margin-bottom: 2em;
    }

    .r1-img {
        padding: 1px 0 0 1px;
        width: 100%;
        height: auto;
    }

    .r1-txt {
        width: 100%;
        padding: 0 1px;
        letter-spacing: 2px;
        height: auto;
        margin: 0 0 10px;
    }

    .r1-txt p:first-child {
        position: relative;
        padding: 10px 0 0 65px;
        text-align: left !important;
        font-size: 1.5em !important;
        line-height: 1.2;
        margin: 0 0 0 0 !important;
        min-height: 70px;
    }

    .r1-txt p:first-child:before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/event/rank/rank_1909_r31.jpg) -350px 0 no-repeat;
        background-size: 500px;
        width: 50px;
        height: 70px;
    }

    .r1-txt p + p {
        text-align: left !important;
        line-height: 1.6 !important;
        letter-spacing: 0;
        font-size: 1.2em !important;
    }

    .r1-txt p + p br {
        display: none;
    }

    .r-btn {
        width: 70%;
        padding: 5px 10px;
        margin: 5px auto 10px;
        background-color: #967a48;
        text-align: center;
        color: #fff;
        font-size: 12px;
    }

    .r-btn::after {
        content: "はこちら →";
    }

    .r3box.r2box {
        margin: 0 auto 2em;
    }

    .r3box.pickUp {
        margin: 1em auto 3em;
    }

    .r3box ul li {
        width: calc(100% / 3 - 2px);
        border: solid 1px #ccc;
    }

    .r3box.r2box ul li {
        width: calc(100% / 2 - 2px);
        border: solid 1px #ccc;
    }

    .r3box.pickUp ul li {
        font-size: x-small;
    }

    .r3box.pickUp ul li .r-btn {
        display: none;
    }

    .r3-txt {
        padding: 5px 0 0;
    }
}

.rankingItem ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: top;
}

.rankingItem ul li {
    width: calc(100% / 2 - 10px);
    box-sizing: border-box;
    margin-bottom: 2em;
}

.rankingItem ul li img {
    width: 100%;
    padding: 0;
    margin: 0;
    display: block;
}

.rankingItem ul li .ri-text {}

.rankingItem ul li .ri-txt_title {
    padding: 20px 0 0;
    text-align: center;
    font-size: 1.1em;
    font-weight: bold;
}

.rankingItem ul li .ri-txt_discription {}

.rankingItem ul li a {
    border: 1px solid #ccc;
    height: 100%;
}

.rankingItem ul li:first-child {
    margin-bottom: 0;
    width: 100%;
}

.rankingItem ul li:first-child:after {
    content: "";
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/event/rank/rank_2009_01.jpg) no-repeat;
    background-size: 100%;
    display: block;
    width: 100%;
    padding: 9.5% 0 0;
}

.rankingItem ul li:first-child a {
    background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/event/rank/rank_1909_r31.jpg) no-repeat 0 0;
    width: 100%;
    height: 498px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: top;
    border: none;
}

.rankingItem ul li:first-child a > * {
    width: 50%;
}

.rankingItem ul li:first-child img {
    height: 497px;
}

.rankingItem ul li:first-child a .ri-txt_title {
    font-size: 2.5em;
    margin: 130px auto 20px;
    letter-spacing: 2px;
}

.rankingItem ul li:first-child a .ri-txt_discription {
    font-size: 18px;
    letter-spacing: 2px;
    padding: 0 10px;
}

.r3-txt:after,
.rankingItem ul li a .ri-txt:after {
    content: "ページはこちら";
    display: block;
    margin: 10px auto 20px;
    padding: 10px;
    text-align: center;
    width: 60%;
    background: #967a48;
    color: #fff;
    font-size: 15px;
    font-weight: normal !important;
}

.rankingItem ul li:nth-child(n+4) {
    display: none;
}

@media only screen and (max-width: 1024px) {
    .rankingItem ul li {
        width: calc(100% / 2 - 4px);
    }

    .rankingItem ul li:first-child a {
        background: none;
        width: 100%;
        height: auto;
        display: block;
    }

    .rankingItem ul li:first-child a > * {
        width: 100%;
    }

    .rankingItem ul li:first-child img {
        height: auto;
    }

    .rankingItem ul li:first-child a .ri-txt {
        margin-bottom: 1.8em;
    }

    .rankingItem ul li:first-child a .ri-txt_title {
        letter-spacing: 2px;
        position: relative;
        padding: 10px 0 0 65px;
        text-align: left !important;
        font-size: 1.5em !important;
        line-height: 1.2;
        margin: 0 0 0 0 !important;
        min-height: 70px;
    }

    .rankingItem ul li:first-child a .ri-txt_title:before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        background: url(https://image.rakuten.co.jp/asia-kobo/cabinet/event/rank/rank_1909_r31.jpg) -350px 0 no-repeat;
        background-size: 500px;
        width: 50px;
        height: 70px;
    }

    .rankingItem ul li:first-child a .ri-txt_discription {
        font-size: 1.3em;
        letter-spacing: 2px;
        text-align: left;
        margin: 0 0 20px;
    }

    .rankingItem ul li:first-child a .ri-txt_discription br {
        display: none;
    }

    .r3-txt:after,
    .rankingItem ul li a .ri-txt:after {
        width: 80%;
        margin: 10px auto 15px;
        padding: 5px;
        font-size: 10px;
    }
}