@charset "utf-8";

@import url("spdelete.css");
@import url("pcdelete.css");
/************************************************
 import css
************************************************ */
ul#fixed_link li:last-child {
    display: none;
}
h5{margin: 10px 0;}
body.LC_Page_Contact_Complete div.env_message,
body.LC_Page_Contact div.env_message,
body.LC_Page_User div.env_message,
body.LC_Page_Index div.env_message {
    display: none!important;
}
.env_message_blank {
    height: 0;
}

.plg_Raku2_LC_Page_Products_List #container{
max-width: 1360px;
}

.main_cate a,.main_cate_other a{display:block;width:100%;height:100%;}
.main_cate li:hover,.main_cate a:hover,.main_cate_other li:hover,.main_cate_other a:hover{opacity:0.8;}


img{
    max-width: 100%;
}
    :root{
        --main_grd45: linear-gradient(to bottom right, #0067B0, #00B7AB);
        --main_grd: linear-gradient(to right, #0067B0, #00B7AB);
    }

body{
background-color: #f5f5f5;
}
    #container{
        max-width: 1100px;
        width: auto;
    }
#main_column.colnum2 {
    width: 860px;
}
      .content_outer a{
        display: inline-block;
        width: 100%;
        height: 100%;
    }
    #container{
        max-width: 1100px;
        width: auto;
    }
   *{
        color: #223744;
    }
    .wrap{
        flex-wrap: wrap;
    }
    #main_column h2{
        border: none;
    }
    .content_outer h2{
        text-align: center;
    }
    .content_outer h2 span{
        display: block;
    }
    .content_outer h2 .title{
        font-size: 26px;
        font-weight: bold;
    }
    .content_outer h2 .sub{
        font-size: 14px;
        font-weight: normal;
    }
    .content_outer h2.line::after{
        content: '';
        display: block;
        width: 40px;
        height: 2px;
        background: var(--accent-color);
        margin: auto;
    }
    .content_outer ul.cards{
        display: flex;
    }
    .content_outer ul.cards li.card{
        background: #fff;
        padding: 8px 20px;
        margin: 5px;
    }
    ul.col2{
        flex-wrap: wrap;
    }
ul.col2 li{
    width: calc(50% - 30px);
} 

.online{
        display: flex;
    }
    .online .left{
        width: 32%;
    }
    .online .right{
        width: 68%;
    }
    .online ul{
        display: flex;
        flex-wrap: wrap;
    }
    .online ul li{
        background: var(--accent-color);
        color: #fff;
    }



    .content_outer p.btn{
        border: 1px solid var(--accent-color);
        border-radius: 50px;
        line-height: 50px;
        color: var(--accent-color);
        width: 80%;
        text-align: center; 
    }
    .content_outer p.btn a{
        color: var(--accent-color);
    }
.content_outer .online{
    background: #fff;
    padding: 20px 40px;
    align-items: flex-end;
} 
#main_column .content_outer .online h2{
    text-align: left;
    font-size: 26px;
}
.online li.card {
    width: 32%;
    margin: 5px auto;
    text-align: center;
    line-height: 40px;
    font-size: .9em;
    color: #fff;
    font-weight: bold;
}
.online li.card a{
    color: #fff;
}

    #headerInternalColumn{
        margin-top: 0px;
        float: none;
width: 100%;

    }
    #header_wrap .inner{
padding: 0;
    }
    div#user_login {
        display: flex;
        align-items: center;
    }
    .gnavi{
        background: var(--main_grd);
    }
    .menu {
        width: calc(100% - 27.4vw);
        position: relative;
        margin-left: auto;
        margin-right: 0;
}
    .logo_area{
        width: 27.4vw;
        border-radius: 0 0 20px 0;
        display: inline-block;
        background: #fff;
        z-index: 20;
        position: absolute;
        top: 0px;
    left: 0;
max-height: 180px;
    }
    .logo_area img{
        box-sizing: border-box;
        width: auto;
        max-height: 200px;
        padding: 1.8vw 5.8vw;
    }
    .ext_links ul, .gnavi ul{
        display: flex;
        justify-content: flex-end;
       font-size: 12px;
    }
    .login_user{
        display: flex;
    }
.menu li{
    padding: 0px 10px;
    margin: 0 1em;
}
.ext_links ul li a{
line-height: 40px;
}
.ext_links ul li.cart a{
color: #fff;
}
.ext_links {
    padding: 14px 0;
}

    .ext_links .cart{
        background: var(--accent-color);
        color: #fff;
    }
    .menu .gnavi li a{
        color: #fff;
    display: inline-block;
    height: 100%;
    width: 100%;
line-height: 40px;
 position: relative;
    }
.menu .gnavi li a{
opacity: 1;
}
.menu .gnavi li a::after{
    content: '';
    width: 0;
    height: 4px;
    position: absolute;
    background: #fff;
    left: 0;
    bottom: 0;
    transition: all 0.3s ease 0s;
}
.menu .gnavi li a:hover:after{
    width: 100%;
}
.login_user .btn input{
    margin-left: 10px;
    
}
.mi_user a{
padding: 10px;
}
    .greeting{
        background: #fff;
        padding: 50px;
    }
    .greeting p{
        max-width: 800px;
        margin: auto;
        font-size: 16px;
    }

    /*スライダー*/
    #main_slide_image{
        margin-top: 0;
    }


#login_area h2, #search_area h2, #calender_area h2, #cart_area h2, #cart h2, #category_area h2 {
    background-color: #fff;
    color: #0084b2;
    border: 1px solid #c5d3dd;
    font-weight: bold;
}
.btn input {
    background: #0084b2;
}

dl.newslist {
    display: flex;
}
dl.newslist > dt:nth-child(2){
background: #0084b2;
padding: 0px 14px;
    margin: 0 10px;
    border-radius: 20px;
    color: #fff;
}
#news_area  dl.newslist > dt:nth-child(2) a{color: #fff;}

div#news_area {
    background: #fff;
    display: flex;
    padding: 20px;
    align-items: flex-start;
}
.news_contents {
    border-left: 1px solid var(--accent-color);
    padding-left: 14px;
}

#news_area h2{
    padding-right: 14px;
min-width: 6em;
    }
#news_area .block_body{
    width: 82%;
}
    #detailarea .product_code{
        border: none;
    }
    #detailarea .product_text_area ul{
        margin-bottom: 40px;
    }
    .ins_catalog_caption_pc li,
    #detailarea .product_text_area ul li{
        float: none;
        margin: 20px 0;
    }
    .product_text_area >div{
        margin: 100px 0;
        padding: 0 20px;
    }
    .flex{
        display: flex;
    }

    img.w30p{
        width: 30%;
        margin-right: 20px;
    }
    #detailarea .product_text_area h3{
        padding-bottom: 10px;
        font-size: 26px;
        margin-left: -20px;
    }
#main_column .history_list h2{
    border: none;
    font-size: 26px;
    font-weight: bold;
    width: 100%;
    margin: 0;
}
#main_column .history_list h2:after,
    h3.product_sub_name::after,
    #detailarea .product_text_area h3::after{
        content:"";
        display: block;
        width: 100%;
        height: 4px;
        margin-top: 10px;
        background: var(--main_grd);
    }
    #detailarea .product_text_area h4{
        margin: 20px 0 10px;
        font-size: 20px;
    }

    .productImage img.title_icon {
    object-fit: contain;
    width: 100%;
    height: 120px;
    border: 1px solid #ccc;
}
.fa-shopping-cart:before {
    color: #fff;
}
#detailarea .cartin_btn a #cart {
    border-radius: 50px;
}
#detailarea .cart_area {
    background-color: #fff;
}
#detailarea .favorite_btn a {
    border-radius: 0;
    color: #0084b2;
    border: 1px solid #0084b2;
}

.LC_Page_Index #container #main_column .block_outer,
.LC_Page_Index div#main_column > div{
margin-top: 120px;
}
.support{
text-align: center;
}

/*フッター*/
     #footer {
        background: var(--main_grd45);
    }
    #footer .inner ul{
        background: transparent;
        color: var(--main-color);
    }
    #footer .inner{
        display: flex;
        width: 960px;
    margin: auto;
    justify-content: space-around;
    padding: 100px 0 20px;
    }
    #footer .inner ul li{
        border: none;
        float: none;
        display: block;
        text-align: left;
        margin: 0;
    }
    #footer .inner ul.items li{
    /*width: 170px;*/
    width: 100%;
}
    #footer .inner ul li a{
        display: inline-block;
        width: 100%;
        height: 100%;
        line-height: 25px;
        color: #fff;
        position: relative;
    }
    #footer .inner ul li a::after{
        content: "";
        height: 2px;
        width: 0;
        display: block;
        background: #fff;
    }
    #footer .inner ul li a:hover::after{
        width: 100%;
    }
    #footer .company img{
        width: 200px;
        padding-bottom: 40px;
    }
    #footer .inner .company ul li a{
        font-weight: bold;
    }
    #footer .inner ul li.h{
        color: #fff;
        font-weight: bold;
    }

    /*#footer .inner .f-link {
    display: flex;
    width: 38%;
    }*/
    #footer .inner .f-link {
    display: grid;
    grid-template-columns: auto auto;
    grid-column-gap: 3em;
    }
    .copy{
     text-align: center;
    color: #fff;
    padding: 0 100px;
    }
.copy p, .copy p a{color: #fff;}
/*下層ヘッダー*/

    #under_header_wrap {
        background: var(--main_grd);
}
    #under_header_wrap >div{
        align-items: center;

        max-width: 1500px;
        padding: 18px 100px;
        position: relative;
    }
img.under_logo{
    width: 9.5vw;
}
#under_header_wrap .gnav{
    position: absolute;
    right: 180px;
    top: 45px;
}
#under_header_wrap .ext_links {
    position: absolute;
    right: 110px;
    top: 0;
    padding: 0;
}
#under_header_wrap .ext_links ul li{
margin: 0 14px;
}
#under_header_wrap .ext_links ul li a{
    color: #fff;
}
#under_header_wrap .gnav li{
    padding: 0 14px;
}
#under_header_wrap .gnav li a{
    color: #fff;
font-size: 14px;
}
#under_header_wrap .carticon{
    margin-left: auto;
float: right;
}
#under_header_wrap .carticon a{
margin: 4px;
}
#header_wrap li.cart::before{
content: "";
width: 30px;
height: 30px;
background-image: url("https://biz.om-digitalsolutions.com/user_data/packages/raku2pc/img/top/under_carticon.png");
    display: inline-block;
    vertical-align: middle;
    background-size: cover;
    margin-right: 10px;
}
.gsite::after, .indiv::after{
content: "";
width: 14px;
height: 14px;
background-image: url("https://biz.om-digitalsolutions.com/user_data/packages/raku2pc/img/top/icon_blank_blue.png");
    display: inline-block;
    vertical-align: middle;
    background-size: cover;
    margin-left: 4px;
}
#under_header_wrap .gsite::after,
#under_header_wrap .indiv::after{
background-image: url("https://biz.om-digitalsolutions.com/user_data/packages/raku2pc/img/top/icon_blank.png");
}


/*カテゴリページ*/
.picup_item ul{
    margin: 20px 0;
}
.picup_item ul li{
    margin: 10px;
}
.under_category ul{
    flex-wrap: wrap;
    background-color: #C5D3DD;
    justify-content: flex-start;
    padding: 20px 0;
    margin: 20px 0;
}
.under_category ul li{
    background-color: #fff;
    text-align: center;
    width: 31%;
    margin: 5px 1%;
}
.under_category ul li a{
    display: inline-block;
    width: 100%;
    height: 100%;
    padding: 10px 0;
    box-sizing: border-box;
    position: relative;
}
.under_category ul li a::after{
    content: '';
    width: 0;
    height: 4px;
    position: absolute;
    background: var(--accent-color);
    left: 0;
    bottom: 0;
    transition: all 0.3s ease 0s;
}
.under_category ul li a:hover{
    opacity: 1;
}
.under_category ul li a:hover:after{
    width: 100%;
}
.category_contents .fv img{
    height: 360px;
    width: 100%;
    object-fit: cover;
}

/*------------------------------------------
#main_column h2.title::after,
.content_outer h2.line::after {
    content: '';
    display: block;
    width: 40px;
    height: 2px;
    background: var(--accent-color);
    margin: auto;
}
------------------------------------------*/
#main_column h2.title{
border-bottom: none;
}

body.plg_Raku2_LC_Page_Products_List h2.title{
    margin: -0.5em 0;
    font-size: large;
}
body.plg_Raku2_LC_Page_Products_List h2.title::after{
    content: '';
    display: block;
    height: 2px;
    background: var(--base-line-color);
}

    .card p.btn{
        line-height: 24px;
        padding: 0 20px;
    width: 8em;
    margin-left: auto;
margin-top: 20px;
    }


#main_slide_image .bxslider li img{
    width: 100%;
}

/*ワンカラムにしたので全体幅調整*/
.LC_Page_Index #container{
max-width: 1200px;
}
.content_outer.business_solution {
    background: #e0e0e0;
    width: 100vw;
    margin: auto;
    margin-left: calc(50% - 50vw);
    padding: 80px calc(50vw - 50%);
    box-sizing: border-box;
}
.content_outer.business_solution ul.cards li.card{
    background: transparent;
width: 25%;
position: relative;
bottom: 0;
right: 0;
    padding-bottom: 38px;
padding: 4px;
}

.content_outer.business_solution ul.cards li.card p.btn{
        position: absolute;
    right: 0;
    bottom: -20px;
background: var(--accent-color);
}
.content_outer.business_solution ul.cards li.card p.btn a{
  color: #fff;
}
.content_outer.kari ul.cards li.card {
    background: transparent;
width: 32%;
}

.content_outer.kari ul.cards{
padding-bottom: 80px;
}
.content_outer.kari ul.cards li.card h3{
padding: 14px 4px 8px;
}
.content_outer.kari ul.cards li.card p{
padding: 0 4px;
}
.content_outer.business_solution li.card img{
padding: 10px 0px 14px;
}

/*サムネ調整*/

@media (max-width: 900px) {
.listphoto {
    width: 200px;
    height: 200px;
}
}

@media (max-width: 899px) {
.listphoto {
    width: 100px;
    height: 100px;
}
}

.list_area .listphoto img {
    width: 13em;
    margin-bottom: 0;
    /*height: 100%;*/
    height: 13em;
    object-fit: contain;
background-color: #fff;
}

/*商品詳細ページ*/
nav {
    margin-bottom: 2em;
}
.plg_Raku2_LC_Page_Products_Detail #container{
max-width: 1200px;
}

    #footer .footer_manu ul li {
        font-size: 0.8em;
        margin: 10px auto;
    }

h2.category-title{
    text-align: center;
}

#button_lower span{
    color: #fff;
}

.new-btn{
    margin-bottom: 5px;
}
.new-btn a{
background: #0084b2;
color: var(--char-color);
padding: 4px 8px;
    border-radius: 4px;
    width: 100%;
display: inline-block;
    text-align: center;
    box-sizing: border-box;
}

.product_text_area p b:not(:first-child) {
    display: inline-block;
    margin-top: 10px;
}
#header_login_area #user_login p span,
#header_login_area #user_login p,
.btn_area.btn_type_def li a span{
color: #fff;

}
#header_login_area #user_login{
position: relative;
    top: 0;
    right: -23px;
}
#header_login_area .btn_outer {
    margin-top: -10px;
}

/*商品詳細ページのFAQ*/
label.faq-title p::before {
    content: "Q";
    display: inline-block;
    border: 2px solid;
    padding: 8px;
    height: 20px;
    width: 20px;
    text-align: center;
    line-height: 20px;
    border-radius: 20px;
    margin-right: 10px;
font-weight: bold;
    color: #f95d6c;
}

.faq-conteiner p::before {
    content: "A";
    display: inline-block;
    border: 2px solid;
    padding: 8px;
    height: 20px;
    width: 20px;
    text-align: center;
    line-height: 20px;
    border-radius: 20px;
    margin-right: 10px;
    font-weight: bold;
    color: #39c;
}

.product_text_area p{
margin-bottom: 0!important;
}
.faq-conteiner p{
padding: 14px;
}

/*▲商品詳細ページのFAQ　ここまで▲*/

#my-kiysku{
    background: #fff;
padding: 20px;
}
	#my-kiysku .text_area {
    height: 300px;
    overflow-y: scroll;
	font-size: 14px
}
#my-kiysku .text_area >ul li{
	margin: 10px 0;
}
#my-kiysku .text_area ul li ul{
	margin-left: 14px;
}
#my-kiysku .text_area ul li ul li{
	margin: 0;
}
div#mypagecolumn #my-kiysku h4{
	font-size: 14px
}

/*商品詳細 ...打ち消し */
div.listrightbloc h3 {
white-space: normal;
text-overflow: clip;
}

/*ー・－・－・－OMDS_CSSー・－・－・－*/
.deliv_fee .include::after{content:'(当社負担)';}
.newslist dd{width:60%;}
dl.newslist {align-items: center;}
/*#category_area ul li:last-child{font-weight:bold;}*/

/* 予約日のテキスト変更！！日付は手動で変えること！！ */
/* 元テキストを隠して疑似要素で表示 */
/* .release_date {
  visibility: hidden;
}
.release_date::after {
  content: "発売予定日　:2025年03月01日";
  visibility: visible;
  display: block;
}*/

/* ECスペック表表示 */
.specs {
    padding: 0 20px;
}
.specs > h3 {
    padding-bottom: 10px;
    /* margin-left: -20px; */
    /* font-size はPCでのみ設定 */
}
.specs > h3::after {
    content: "";
    display: block;
    width: 100%;
    height: 4px;
    margin-top: 10px;
    background: var(--main_grd);
}
.specTable {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 38px;
    width: 90%;
    height: 380px;
    overflow-y: scroll;
    border: 1px solid #ccc;
    padding: 20px;
    margin-top: 20px;
    background-color: #fff;
}
/* PCスタイル（幅768px以上） */
@media screen and (min-width: 768px) {
    .specs > h3 {
        font-size: 26px;
    }
    .specTable {
        width: 85%;
        height: 500px;
    }
}
/*ー・－・－・－・ー・－・－・－*/

/*商品詳細 定期アイコンサイズ */
#detailarea ul.status_icon li img#icon_teiki {
    width: 100px !important;
    max-width: 100px;
}
span#price02_title_default {
    display: none;
}

/*継続アイコン*/
#mycontents_area.periodical_order_history .periodical_order_detail_bloc.periodical_info,
.periodical_history_list .periodical_info{
    border: none;
    background: #fff;
}
#mycontents_area.periodical_order_history .periodical_order_detail_bloc span.periodical_status,
.periodical_history_list .periodical_info span.periodical_status{
    background: #eeaa55;
}
th.raku2_teiki_count.alignC,
td.raku2_teiki_count.alignC {
    display: none;
}