@charset "Shift_JIS"; /**/
/* BASE */
.pB1{padding-bottom: 1%;}
.pB3{padding-bottom: 3%;}
.pB5{padding-bottom: 5%;}
.pB7{padding-bottom: 7%;}
.attention{text-align: right;}
.body_sph .contents_main{margin: 0;}

/* Top Page */
#oshikatsu {
  text-align: center;
  background-color: #FFFFFF;
  font-family: "Noto Sans JP", "icomoon", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
#oshikatsu .item h2,
#oshikatsu .pickup h2{
    font-family: "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro";
    font-size: 2em;
    border-radius: 13px;
    border: 2px solid #6c5073;
    color: #6c5073;
    padding: 1%;
    margin: 0% 5% 3%;
    background-image: url("image/title_shape.png");
    background-position: center;
}
#oshikatsu .limit h2{
    margin: 0% 5% 5%;
}
#oshikatsu h2 span{
    margin-left: 0;
    margin-right: 1%;
}
#oshikatsu h2 span img{
    height: 60px;
}
#oshikatsu .item h2{background-color: #ebf4f6;}
#oshikatsu h2#title_pickup{background-color: #fef2f5;}
#oshikatsu h2#title_limit{background-color: #fff7e3;}

#oshikatsu h3 {margin: 0% 5% 3%;}
#oshikatsu .other h3{
    color: #6c5073;
    font-family: "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro";
    font-size: 2em;

}
/*========= ナビ ===============*/
#oshikatsu nav {
    display: flex;
    gap: 5px;
    margin: 4% 1% 7%;
}

/*========= 対象商品リスト ===============*/
#oshikatsu .item .product-list {
    list-style: none;
    padding: 0;
    margin: 2% 6%;
    width: auto;
    border: 1px solid #6c5073;
}
#oshikatsu .item p{
    color: #6c5073;
    font-size: 1.7em;
    padding: 0% 13%;
    text-align: left;
    margin-bottom: 0.5em;
}
#oshikatsu .item p span{
background: linear-gradient(transparent 70%, #c5e8f0 70%);
    display: inline;
    font-weight: bold;
}
#oshikatsu .item .product-item {
    display: flex;
    align-items: center;
    padding: 1% 2%;
    font-size: 1.1em;
}
#oshikatsu .item .product-item:nth-child(odd) {
    background-color: #ebf4f6;
}
#oshikatsu .item .product-item:nth-child(even) {
    background-color: #ffffff;
}
#oshikatsu .item li a{color:#6c5073;}
#oshikatsu .item .product-icon {
    width: 15px;
    height: 15px;
    background-color: #99b9c0;
    border-radius: 50%;
    margin-right: 10px;
}
#oshikatsu section.pickup, #oshikatsu section.limit, #oshikatsu section.other{padding-top: 10%;}
/* 商品インクルード */

#oshikatsu .display_matrix{
    display: flex;
    flex-direction: row;
    width: 100%;
    margin: 0 auto;
    flex-wrap: wrap;
    justify-content: flex-start;
    
}
#oshikatsu .display_matrix li{
     width: 33%;
    text-align: center;
    padding-bottom: 3%;
}

#oshikatsu .btn {
    width: 100%;
    margin-left: auto;
    margin-top: 1em;
    background-color: #6c5073;
    position: relative;
    transition: 0.2s;
}
.body_sph #oshikatsu .btn {
    width: 100%;
    margin-top: 0.5em;
    border-radius: 5px;
}
#oshikatsu .btn:hover {
    opacity: 0.7;
}
#oshikatsu .btn p{
    margin-bottom: 0;
    color: #fff;
    text-align: center;
    padding: 4% 20% 5% 4%;
    font-size: 1.1em;
}
#oshikatsu .btn p::after {
    content: '\e96a';/*矢印アイコン*/
    font-size: 1.5em;
    position: absolute;
    top: 10%;
    right: 5%;
    -webkit-text-stroke: 1px #6c5073;/*背景と同じ色で線を付けて細く見せる*/
}
#oshikatsu .copy {
    display: none;
}
#oshikatsu ul.list_circle > li:before {
    content: "●";
    color: #d1aadd;
    margin-right: 0.2em;
}
/********* 応募方法部分 *********/

/* 基礎 */
#oshikatsu .box_01{
    background: #f7f0f9;
    padding: 4% 4% 7%;
}
.body_sph #byebye .box_01{font-size: 80%;}
#oshikatsu .box_01 p{text-align: left;}
.body_pc #byebye .box_01 p{font-size: 110%;}

/* 内側の白い部分 */
#oshikatsu .box_s01{
    background: #fff;
    padding: 4%;
	border-radius: 20px;
    margin-bottom: 5%;
}

/* 画像の余白 */
#oshikatsu .box_oubo{margin-bottom: 5%;}

/* 応募方法文言 */
.body_pc #oshikatsu .box_oubosph,
.body_sph #oshikatsu .box_oubopc{
	display:none;
}

/* カート部分画像表示切替 */
.body_pc #oshikatsu .box_oubosph2,
.body_sph #oshikatsu .box_oubopc2{
	display:none;
    padding: 5% 0;
}

/* 購入方法 */
#oshikatsu .box_01 h3{
    text-align:left;
    color: #e13858;
    font-size:1.5em;
    padding-top: 3%;
}

.body_sph #oshikatsu .box_01 h3{
    font-size: 1em;
    padding-top: 2%;
}

/* ページ下部注意文言 */
#oshikatsu .list_circle li{padding-bottom: 1%;}
.body_sph #oshikatsu .list_circle li{
    font-size: 0.8em;
    margin: 0 3%;
}
#oshikatsu .phone a:link{color: #3d256a;}

/* 応募方法タイトル */
#oshikatsu .oubo_title {
    background: #fff;
    padding: 2%;
    margin-bottom: 3%;
    font-size: 2.5em;
    font-weight: bold;
    letter-spacing: 0.1em;
    border-radius: 5px;
    color: #e13858;
    border: #e13858 solid 2px;
    }
#oshikatsu .apa {padding: 7% 3% 0%;}
#oshikatsu .apa p{
    font-family: "ヒラギノ丸ゴ Pro W4", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro";
    margin-bottom: 0.5em;
    font-size: 1.3em;
}
/*================
以下スマホ用
==================*/
@media screen and (max-width:768px){
.pB3{padding-bottom: 5%;}
.pB7{padding-bottom: 5%;}
.w60{width: 60%;}
.w85{width: 85%;}
.w90{width: 90%;}
p.attention{font-size: 0.6em;}
#oshikatsu .item h2, #oshikatsu .pickup h2{
    font-size: 1.5em;
    padding: 2% 1%;
    margin: 0% 3% 3%;
    background-size: cover;
}
#oshikatsu .limit h2 {
    margin: 0% 3% 5%;
}
#oshikatsu h2 span img {
    height: 50px;
}
#oshikatsu .item .product-list {
    margin: 2% 3%;
}
#oshikatsu .item li a {
    text-align: left;
    font-size: 0.8em;
}
#oshikatsu .item .product-icon {
    width: 12px;
    height: 12px;
    margin-right: 5px;
}
#oshikatsu .item p {
    font-size: 1.0em;
    text-align: left;
    padding: 0% 3%;
}
#oshikatsu .display_matrix{width: 100%;}
#oshikatsu .display_matrix li {
    width: 33%;
    padding-bottom: 5%;
}
.display_matrix .goods_set, .display_matrix2 .goods_set, ul.display_hybrid .goods_set, ol.display_hybrid .goods_set {
    margin: 0 0.3em;
}
#oshikatsu .btn p {
    font-size: 0.7em;
    padding: 10% 8% 10% 0%;
}
#oshikatsu .btn p::after {
    top: 23%;
    right: 3%;
}
#oshikatsu h3 {margin: 0% 2% 3%;}
#oshikatsu .other h3{font-size: 1.5em;}
    #oshikatsu .oubo_title{font-size: 1.5em;}
#oshikatsu .apa p{
    font-size: 1.0em;
}
}
