@charset "UTF-8";
/* CSS Document */

body {

    -webkit-overflow-scrolling: touch;
}

#contents.searchform {
    background-color: #fff;
    position: fixed;
    width: 100%;
    z-index: 100;
}

#search-cat.wrp {
    display: flex;
	height: 100vh;
    /* height: calc(100vh - 110px); */
    overflow: auto;
    padding-top: 59px;
    -webkit-overflow-scrolling: touch;
}

ul.left-category-list {
    height: auto;
}
    #search_area {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        z-index: 1000;
		border-bottom: 1px #ddd solid;
    }
	#search_area {
    background-color: #fff;}
    #search_area .search_input {
        background-image: url(../images/web/ico_loupe.svg),url(../images/web/ico_camerasearch.svg);
        background-repeat: no-repeat, no-repeat;
        background-position: 5% center, 95% center;
        background-size: 15px 15px, 19px 15px;
        border-color: #9e9e9e;
        border-radius: 8px;
        border-style: solid;
        border-width: 1px;
        box-sizing: border-box; 
        color: #9e9e9e;
        font-size: .75rem;
        line-height: 2.375rem;
        margin: 0 auto;
        padding: 0 10%;
        width: 85vw;
    }
    #search_area.category_search .search_input {
        background-color: #f2f2f2;
        background-image: url(../images/web/ico_loupe_category.svg);
        background-repeat: no-repeat;
        background-position: 5% center;
        background-size: 15px 15px;
        border:none;
    }
    #search_area .search_wrap {
        padding: 10px;
    }
    #search_area {
        padding: 0;
        margin-bottom: 0;
    }
    #search_area .popular_word_list {
        max-width: 85vw;
    }
#search-cat .container {
    display: block;
    height: 100%;
    overflow: auto;
    width: calc(100% - 100px);
    -webkit-overflow-scrolling: touch;
}
#search-cat .contents {
    height: auto;
	padding-left: 0;}

#search-cat #left-menu {padding-top: 15px;}
#category-home-app {padding:10px 8px 0 8px;}
#left-menu h4.sttl_app {font-size: auto; display: flex; align-items: center;justify-content: center;text-align: center; margin: 0 auto .5em; letter-spacing: 0;}
#left-menu h4.sttl_app::before {
    content: "";
    display: inline-block;
    width: 5px;
    background-color: #df4525;
    margin-right: .2em;
    height: 1.1em;}
#search-list.wrp {display: block; padding-top: 59px;}
#search-list.wrp .container-full:first-child {padding-top: 0;}
#search-list p.result_txt { font-size: .6875rem; font-weight: bold; display: flex; justify-content: flex-end; align-items: baseline; margin-bottom: 0;}
#search-list p.result_txt em { color: #DF4525; font-size: 1rem; font-style: normal;}

.container-full .inner {padding: 0 7.5vw;}
#search-list.wrp .container-full.nopdb-line { padding-bottom: 0; border-bottom: 1px #EAEAEA solid;}
.pager-box {}
.pager-box ul.pager-list { border: 1px #DBDBDB solid; background-color: #F2F2F2; display: table; height: 36px; padding-left: 0;width: 100%;}
.pager-box .pager-list li {width: 36px; display: table-cell; vertical-align: middle; text-align: center; padding: 0;}
.pager-box .pager-list li:nth-child(2),.pager-box .pager-list li:last-child {border-left: 1px #DBDBDB solid;}
.pager-box .pager-list li img {height: 12px;}
.pager-box .pager-list li.pager_text { text-align: center; width: auto; font-size: .75rem;}
.pager-box .pager-list li.pager_text:not(:first-child) {border-left: 1px #DBDBDB solid;}
.pager-box .pager-list li:nth-last-child(2) {border-left: 1px #DBDBDB solid;}

.new-inner {padding: 0 7.5vw 7.5vw;}
.new-inner.list-foot {padding: 0 7.5vw 90px 7.5vw;}
#footer_nav {background-color: #ededed;}
#footer_nav .inner {padding-top: 20px;}

.list_campaign li img {width: 100%;} /*iPad 対応*/

/*
 * button
 */
.btn {height: 48px; padding-top: 0; padding-bottom: 0;}
.btn-gotop .btn.gotop, .btn-go .btn.go,
.btn.next, .btn.confirm, .btn.snslink, .btn-charge .btn.charge{ background-color: #96DC5F !important;}
.btn-charge .btn.charge {    background-color: #83ba5a;}
.btn.disabled { background-color: #fff !important;}
.disabled {color: #777;}

.btn .icon.right {position: absolute; right: 3.2vw;}
.icon img {height: 12px;}
.btn.cancel .icon {position: absolute; left: 3.2vw;}

/*
 * web style 不足分
 */
  /* .btn_apply_sp {
    display: block;
    width: 100px; max-width: 100px;
    position: fixed;
    right: -15px;
    bottom: -15px;
    z-index: 100;
    transform-origin: 0 100%;
    transition: all 500ms 0s ease;}
.btn_apply_sp img {display: block;}
.btn_apply_sp.active {
    transform: rotate(120deg);
    -moz-transform: rotate(120deg);
    -webkit-transform: rotate(120deg);
    -o-transform: rotate(120deg);
    -ms-transform: rotate(120deg);} */

#search-list .breadcrumb ul, .breadcrumb ol {margin: .5em auto 0; padding: 0;}
#search-list .breadcrumb li{ font-size: .625rem;}
#search-list .breadcrumb li + li::before {content: "";}
#search-list .breadcrumb li:last-child {font-weight: bold;}
#search-list .breadcrumb a { padding: 0 .25em;}
#search-list .breadcrumb:not(:last-child) {margin-bottom: 0;}
#search-list .result_inner {width: 100%;}
#search-list ul.result_item li { border-bottom: 1px #EAEAEA solid;}
#search-list ul.result_item li a {padding:.5em 7.5vw .5em 7.5vw;}
#search-list ul.result_item li img {border: none; max-width: 250px;width: 30%;}

#search-list p.result_genre { margin-bottom: 0;}
#search-list h3.result_name { font-weight: bold; margin-bottom: .15em; line-height: 1.3;}
#search-list p.result_maker { }


/*
 * news tab追加　1907
 */

#tab_area {display: block;padding: 15px 5vw 0 5vw; border-top: 1px #dcdcdc solid;border-bottom: 1px #dcdcdc solid; background-color: #fff;
position: sticky;
position: -webkit-sticky;top: 0;z-index: 1000;}
#tab_area ul {display: flex; padding-left: 0; margin-bottom: 0;}
#tab_area ul li {display: inline-flex; width: 49%; text-align: center;align-items: flex-end; justify-content: center;padding-bottom: 5px;}
#tab_area ul li.active {border-bottom: 2px #dd4525 solid;}

.tabcontent {padding-top: 18px;}
#news.contents {max-width: 100%;}
#news.tabcontent ul.list_news li { color: #333; border-bottom: 1px #f1f1f1 solid; padding: 0 7.5vw 15px; margin-bottom: 14px; line-height: 1.6;}
#news.tabcontent ul.list_news .dates {font-weight: normal; color: #666666; font-size: .625rem;}
#news.tabcontent ul.list_news li .cat {font-size: .625rem;padding: .03rem 0;width: 7em; margin-bottom: .5em;}

/*
 * app
 */
@media screen and (max-width: 768px){
    #slider {
        margin-top: 0; padding-bottom: 10px;
    }
	#slider .arrow {top:50%; margin-top: -6.5%;}
    .contents {
        max-width: 85vw;}

#search-cat #left-menu {
    height: 100%;
    overflow: auto;
    width: 100px;}
#left-menu h4.sttl_app {font-size: .6875rem; }
	.col3-box { padding-left: 0;}
	.category-linebox { border-color: #E0E0E0; padding-top: 10px;}
	ul.left-category-list li a {border-bottom:2px #f4f4f4 solid; font-size: .6875rem; letter-spacing: 0;}

ul.cat-s-box {display: block; letter-spacing: -.5em; margin: 0 0 15px 0; padding: 0; width:100%;}
ul.cat-s-box li {display: inline-block; width: calc( 33.33% - 2px ); padding: 0 0; vertical-align: top; letter-spacing: normal; margin-bottom: 0; border-right: 2px #f4f4f4 solid;border-bottom: 2px #f4f4f4 solid;}
ul.cat-s-box li a { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin:0 auto ; padding:3px 5px 0;  background-color: #fff; border: none; width: 100%;}
ul.cat-s-box li a img {max-width: 90%;}
ul.left-category-list li a.current {background: linear-gradient(90deg,#db9077 0%,#db9077 6%,#f4f4f4 6%,#f4f4f4 100%);}


h3.link-ttl::after {content: '';
  display: inline-block;
  width: .8em;
  height: .8em;
  background-image: url(../images/web/arrow_gray.svg); background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;}
#search-list p.result_genre { font-size: .6875rem;}
#search-list h3.result_name { font-size: .875rem;}
#search-list p.result_maker { font-size: .6875rem;}
#footer_nav .inner dl:first-child {margin-bottom: .65625rem;}
#footer_nav p { display: block; width: 100%;}
}

@media screen and (max-width: 365px){
#web h5, h6 {
    font-size: .875rem;}
#web li {font-size: .75rem;}
    }
    
/*
 *tradein
 */
.product_list a:link,.product_list a:visited,.product_list a:active,.product_list a:hover {text-decoration: none;}
.content .nav_list a.next.active {    border-color: #96dc5f;}
.content .nav_list.multiple li.gotop {width:80%; margin: 0 auto;}
#tradein .content li + li {margin-top: 0;}
#tradein .content ul { list-style-type: none;}
#tradein .breadcrumb li + li::before {content: "";}
#tradein .content figure figcaption {font-style: normal; width: 100%;}
#tradein .content .product_list.product figure img {max-height: 30vw;}
 

#tradein .content .product_list {flex-wrap: wrap; max-width: 960px;} 
#tradein .content .product_list li {max-width: 100%;}

#airpods label::before {   background-image: url(../images/web/tradein/ic_airpods.svg); }

@media screen and (min-width: 980px) {
    /* PC調整 */
    #tradein a {text-decoration: none;}
    #tradein a:-webkit-any-link {text-decoration: none;}
    .product_list a:link,.product_list a:visited,.product_list a:active,.product_list a:hover {text-decoration: none;}

    .content .nav_list a.next.active {    border-color: #96dc5f;}
    .content .nav_list.multiple li.gotop {width:80%; margin: 0 auto;}
    .content .product_list.product li a + a img {max-width: 70%;}
    .content .product_list.product figure img {max-height: 30vw;}
    /*
    * L size banner
    */
    .list_campaign li.bnr_1col {width: 100%;} 
}

@media screen and (max-width: 768px) {
    #tradein .content .product_list li {max-width: 100%;}
    
    #tradein .year {width: auto;}
    #tradetitle h1 strong { color: #fff;}
    #tradein .content .nav_list.multiple li + li {margin-top: 0;}
    #tradein .content .product_list.product li a.bt img { display: none;}
    #tradein .content .product_list.product li a.bt {display: block; margin: 0 auto;width: 70%; height: 10vw; background-attachment: scroll; background-image: url(/themes/images/web/tradein/button_sp.svg); background-position: center center; background-size: 100%; background-repeat: no-repeat;}
    
    #macnote label::before,
    #macdesk label::before {background-size: 65%;}
    #iphone label::before {background-size: 28%;}
    #ipad label::before {background-size: 40%;}
    #ipod label::before{background-size: 25%;}
    #airpods label::before {background-size: 60%;}
    #applewatch label::before {    background-size: 30%;}
}
#tradetitle h1 strong {padding-top: .65em;padding-bottom: .65em; display: inline-block;color: #fff;}

tr.disable{display: none;}

/* 202009019 tradein 追加*/
.content .nav_list li {margin: 0 auto;}
.content .product_list.year label {display: inline-flex; align-items: center; width: 100%; justify-content: center;}

#sec2 #product_list label,#sec3 #product_list label,#sec4 #product_list label,#sec5 #product_list label {text-align: center;}
@media screen and (max-width: 768px) {
#sec1 #product_list label { text-align: left;}
#sec1.content .product_list label {padding: 1rem 1rem 1rem 35%;}
#sec2.content .product_list label,#sec3.content .product_list label,#sec4.content .product_list label,#sec5.content .product_list label {padding: 1rem 1rem 1rem 1rem; text-align: center;}
#tradein .content .product_list {display: flex; flex-wrap: wrap; justify-content: space-between;}
#tradein #sec1 #product_list li {width: 48%;}
#tradein .product_list li {width: 48%;}
}
@media screen and (max-width: 680px) {#tradein .content .product_list li {width: 100%;}}
@media screen and (max-width: 440px) {
#tradein .product_list li {width: 48%;}
#tradein #sec1 #product_list li {width: 100%;}
#tradein .product_list.year li {display: inline-flex; width: 48%;}}

/* 2021.11.9 */
.raiten_lp .btn_apply_sp {display: none;}