/* h1.product_title {
    margin:15px 0;
    padding:3px 0 3px 15px;
    font-size:16px;
    text-align:left;
    color:#333;
} */

h1.sp-product_title {
    margin: 0px 0px 10px 0px;
    padding:0 10px;
    font-size:14px;
    text-align:left;
    color:#333;
}

.no-display{
display:none;
}
/***************************
    商品写真
****************************/
div#itemphotos {
}
.imgwrap {
max-width:500px;
padding-bottom:100%;
}
div#itemphotos .sp-thumbnail {
    text-align: center;
    width: 100%;
}
div#itemphotos .sp-thumbnails > .sp-thumbnail {
    position: relative;
    height: 84px;
    width: fit-content;
    aspect-ratio: 1;
    float: left;
}
div#itemphotos .sp-thumbnail img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}
div#itemphotos .sp-thumbnail-container {
border:1px solid #ccc;
}
div#itemphotos .sp-selected-thumbnail {
border:1px solid #999;
}

div#itemphotos img {
    text-align: center;
    width: 100%;
}
div#itemphotos .sp-slide img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    object-fit: contain;
}

div#itemphotos .sp-thumbnail:hover img {
    filter: brightness(110%);
    transition-duration: 0.3s;
}
/* TN不動モード */
div#itemphotos.tn-list .sp-thumbnails-container {
width: 100% !important;
}
div#itemphotos.tn-list .sp-thumbnails {
width: 100% !important;
transform: translate3d(0px, 0px, 0px) !important;
}

div#itemphotos.tn-list .sp-thumbnail-container {
margin:1px;
width: calc((100% - 10px) / 5) !important;
height: initial !important;
}

div#itemphotos.tn-list .sp-thumbnail {
padding-bottom: 100%;
}
div#itemphotos.tn-list .sp-slides-container .sp-grab label, div#itemphotos.tn-list .sp-slides-container .sp-grabbing label{
cursor:zoom-in;
}
div#itemphotos.tn-list .sp-thumbnails-container .sp-grab, div#itemphotos.tn-list .sp-thumbnails-container .sp-grabbing {
cursor:default;
}
div#itemphotos.tn-list .sp-thumbnails-container .sp-grab .sp-thumbnail-container, div#itemphotos.tn-list .sp-thumbnails-container .sp-grabbing .sp-thumbnail-container {
cursor:pointer;
}

/* クリックで拡大 */
.sp-slide input {
  display:none;
}
.lb {
display: flex;
position: fixed;
width: 100%;
height: 0%;
top: 0;
left: 0;
justify-content: center;
align-items: center;
background: rgba(0,0,0,.7);
opacity: 0;
transition: .3s opacity ease;
z-index: -1;
}

.lb img {
display: block;
max-width: 100%;
max-height: 100%;
width: auto !important;
height: auto;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
transform: scale(.5);
transition: .4s transform ease;
pointer-events: none;
}

label {
cursor: pointer;
}


label img{
width: 100%;
display:block;
}

input:checked + label .lb{
opacity: 1;
height: 100%;
z-index: 103;
}

input:checked + label .lb img {
transform: scale(1);
}


.lb::before,.lb::after {
display: block;
position: fixed;
content: "";
width: 24px;
height:3px;
top: 24px;
right: 12px;
background: #fff;
border-radius: 4px;
z-index: 200;
}
.lb::before {
transform: rotate(-315deg);
}
.lb::after {
transform: rotate(315deg);
}



/***************************
    商品情報ヘッダ
****************************/
#iteminfo {
    position:relative;
    width:100%;
    margin: 0px 0px 15px 0px;
    border-bottom: 3px solid #ddd;
}

#iteminfo p {
    margin:0;
    padding:10px;
    width: calc(100% - 100px);
    font-weight: bold;
}

#iteminfo a {
    color:#333;
    text-decoration:none;
}

#iteminfo a:hover {
    color:#666;
    text-decoration:underline;
}

#iteminfo #brandlogo {
    position:absolute;
    right:0px;
    top:0px;
}
#iteminfo #brandlogo2 {
    position:absolute;
    right:0px;
    top:0px;
}

/***************************
    左列
****************************/
.left_product{
    float: left;
    width: 60%;
    max-width:500px;
}
/*
.more_datail {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.item-box-detail {
    position: relative;
    color: #fff;
    margin-top: 3px;
    margin-right: 3px;
    width: calc((100% - 15px) / 5);
    border: 1px solid #666;
}

.item-box-detail a {
    display: block;
    width: 100%;
    padding-bottom: 100%;
    height: 0;
    position: relative;
}

.item-box-detail img {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
}
*/
/* サムネイルのマウスオーバー
li.item-box-detail:hover a img {
    opacity: 0.9;
    transition-duration: 0.3s;
}
*/
/***************************
    右列
****************************/
.right_product{
    float: right;
    width: 40%;
    padding-left: 1.5%;
}
.detail_h1{
    box-sizing:border-box;
}

.detail02 {
    margin-bottom: 20px;
}

.detail02 p.sp_prod  {
    text-align: center;
    font-weight: bold;
    margin-top: 10px;
}

.money {
    font-weight:bold;
    font-size:24px;
}

.detail03 h3 {
    padding: 5px 0px;
    margin-bottom: 10px;
    border-bottom: 2px solid #317b96;
    display: flex;
    flex-wrap: wrap;
}

.detail03 u {
    float: right;
}

div#select_btn {
    width: 75%;
    margin: auto 5px;
}

p#btn_action {
    width:100%;
}

#select_btn p input
{
    width: 100%;
    padding:5px;
    background: #317B96;
    border: 1px #317B96;
    border-radius: 20px;
    color: white;
    font-weight: bold;
    white-space: normal;
    cursor: pointer;
}

/* ポップアップ用 */
#cart_ins {
  max-height: 1190px;
  overflow: hidden;
}

#cart_ins.on {
  max-height: 9999px;
}

.cart_in {
    display: flex;
    width: 100%;
    border: 1px solid #dadada;
    padding: 5px 0px;
    margin: 5px auto;
    box-sizing: border-box;
}

.cart_in .thumbWrapOut {
    max-width: 60px;
}

.prod_img {
    width: 20%;
    border: 1px solid #aaaaaa;
    padding: 5px 5px;
    margin: 0 5px;
}

.prod_img img{
    max-width: 100%;
}

div#select_btn {
    width: 75%;
    margin: auto 5px;
}

.prod_name {
    width: 67%;
    float: right;
}


#shopping {
    /* デザイン */
    background: #ffffff;
    font-weight: bold;
    color: #317B96;
    border: 1px solid #317B96;
    cursor:pointer;

    /* 位置調整 */
    width: 100%;
    display: block;
    border-radius: 5px;
    padding: 15px;
}


#cart_look {
    /* デザイン */
    background: #317B96;
    font-weight: bold;
    color: #fff;
    border: 1px solid #317B96;
    display: block;

    /* 位置調整 */
    margin-top: 10px;
    margin-bottom: 10px;
    border-radius: 5px;
    text-align: center;
    padding: 15px;
}

.stock_area {
    display: flex;
    flex-wrap: wrap;
    width: 70%;
    margin: auto;
}

.stock {
    width: 100%;
}

button.choose {
    width: 100%;
    padding: 5px;
    background: #4094b3;
    border: 1px #4094b3;
    border-radius: 20px;
    color: white;
    font-weight: bold;
    cursor: pointer;
}

/* ポップアップ用 end */


.detail04 {
    margin: 10px auto;
}

div#cartform {
    display: flex;
    width: 100%;
    box-sizing: border-box;
}

#cartform p.detail_txtl {
    width: 10%;
    padding: 20px 0;
    text-align: center;
}

#cartform select {
    width: 15%;
}

div#btn_disabled {
    width: 70%;
    margin: auto;
}

div#btn_disabled button{
    width: 100%;
    padding: 20px;
    background: #d8d8d8;
    border: #d8d8d8;
    border-radius: 5px;
    color: white;
    font-weight: bold;
}

div#btn_action2 {
    width: 75%;
    padding-left:10px;
}

div#btn_action2 button {
    width: 100%;
    padding: 20px;
    background: #99CC00;
    border: 1px #99CC00;
    border-radius: 5px;
    color: white;
    font-weight: bold;
    cursor:pointer;
}

p.attn {
    text-align: center;
    padding: 10px 0;
}

.detail05 {
}

.sold_info {
    float:left;
    margin:0;
    width:100%;
    margin: 0 0 15px 0px;
    background-color: #ECECEC;
    padding: 10px;
    line-height:1.5;
}

.sold_info p {
    margin-top: 10px;
}

/**************************
 　　　　　　SNS
***************************/
.sns_wrap {
    margin-top: 20px;
    padding: 10px;
    background: #ECECEC;
}

.sns_wrap p {
    margin: 0!important;
}

.sns_wrap ul.sns {
    width: 100%;
    max-width: 200px;
    margin: 10px auto 0 auto;
    text-align: center;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
}

/* @media screen and (max-width: 768px){
    .sns a {
        width: 100%;
    }
} */


.detail06 p{
    color:#666;
    font-size: 13px;
}

/***************************
    中央
****************************/
div.prod_info h2 {
    margin: 10px 0;
    background-color: #317b96;
    border-bottom: 3px solid #6bb5c6;
    margin: 10px 0 3px 0;
    font-size: 15px;
    font-weight: bold;
    color: white;
    padding: 10px 10px;
}

/* 商品コメント */
p#comment , div.comment {
    font-size:12px;
    /* mac ie 除外 \*/
    letter-spacing:0px;
    line-height:1.3;
    padding:10px;
    border:1px solid #fc9;
    background-color:#ffe;
    color:#666;
    margin: 10px 0;
}

div.comment h4 {
    margin-bottom: 10px;
}

.selected{
    display: flex;
    flex-wrap: wrap;
    font-weight:bold;
    color: #CC0000;
    margin-top: 5px;
}

.s_standard{
    display: flex;
    flex-wrap: wrap;
    margin-top: 5px;
}

.cos_s{
    min-width:12%;
    font-weight: bold;
    margin: 0 10px 0 0;
}

#jancode {
    font-size: 85%;
    color: #666;
    margin: 3px;
    padding: 2px 10px;
    float: right;
}




/***************************
・関連商品
・こんな商品も買っています
・この商品と同じ作品タイトルの商品
****************************/

#carouselWrap1, #carouselWrap2, #carouselWrap1 {
        margin: 0px auto;
        position: relative;
        width: 100%;
/*        height: 200px;*/
        overflow: hidden;
}

#carouselPrev1{
    position:absolute;
    width:69px;
    top:65px;
    left:-60px;
    text-align:center;
    cursor:pointer;
}

#carouselNext1{
    position:absolute;
    width:69px;
    top:65px;
    right:-60px;
    cursor:pointer;
    text-align:center;
}

#carouselPrev2{
    position:absolute;
    width:69px;
    top:65px;
    left:-60px;
    text-align:center;
    cursor:pointer;
}

#carouselNext2{
    position:absolute;
    width:69px;
    top:65px;
    right:-60px;
    cursor:pointer;
    text-align:center;
}

#carouselPrev3{
    position:absolute;
    width:69px;
    top:65px;
    left:-60px;
    text-align:center;
    cursor:pointer;
}

#carouselNext3{
    position:absolute;
    width:69px;
    top:65px;
    right:-60px;
    cursor:pointer;
    text-align:center;
}

.sitemlist{
    margin:0px;
    padding:0px;
    width:100%;
    height:200px;
    float:left;
    display: flex;
    left:-55px;
}

@media screen and (max-width: 768px){
.sitemlist{
    left:0px;
}
}

.sitemlist li{
    margin:5px 0px 0px;
    padding:0px 0px 10px;
    width:calc((100% - 75px) / 6);
    text-align: center;
}

@media screen and (max-width: 768px){
.sitemlist li{
    width:calc((100% - 75px) / 3);
}
}

div.recommended-box,
div.relation-box,
div.same_work-box {
    padding:5px;
    background:url("http://stage.cospa.com/img/geestore2/detail/bg_ritem.gif") 0 0 repeat-y;
}

.thumbWrapOut {
    width: 100%;
    max-width: 80px;
    margin: auto;
}
.thumbWrapIn {
    width: 100%;
    height:0;
    padding-bottom: 100%;
    position: relative;
}

.thumbWrapIn img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

img.item-soldout {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.sitemlist li h4 {
    font-size: 12px;
}

div.recommended-box:hover,
div.relation-box:hover,
div.same_work-box:hover {
    opacity: 0.6;
    transition-duration: 0.3s;
}

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

.caroufredsel_wrapper{
    height:200px !important;
}


/******************************
	SP関係
*******************************/

@media screen and (max-width: 768px){
    .left_product{
        max-width: 500px;
        width: 100%;
        margin: auto;
        float: none;
    }

    .right_product{
        width: 100%;
        padding: 0;

    }
    .sliders{
        /* display: none; */
    }

    #select_btn p input
    {
        background: #4094b3;
        border-radius: 20px;
        color: white;
        font-weight: bold;
    }

    #cartform p input {
        margin-left: 27px;
        height: 55px;
        width: 65%;
        background: #6eff00;
        border-radius: 5px;
        color: white;
        font-weight: bold;
    }

    #carouselWrap1, #carouselWrap2, #carouselWrap3 {
        margin: 0px auto;
        position: relative;
        width: 100%;
        height: 200px;
        overflow: hidden;
    }

    .ritemlist {
        margin: 0px auto;
        width: 100%;
        /* width: 792px; */
        display: flex;
        padding: 0 10px;
    }

    #carouselPrev2,#carouselNext2,
    #carouselPrev3,#carouselNext3{
        display: none;
    }

    div#itemphotos {
    }
}





/****************************
    商品情報（コメント・テーブル）
*****************************/
#cartmessage {
    text-align:left;
}

/***************************
    商品ステータス
***************************/
.status img {
    margin:0 2px 2px 0;
}

/***************************
    関連商品
***************************/
#relations {
    clear:both;
}

#relations h2 {
    padding:2px 0 2px 20px;
    margin:0 0 3px 0;
    font-size:14px;
    background:url("http://stage.cospa.com/img/icons/insp.gif") no-repeat left;
    border-bottom:1px solid #317b96;
}

#relations div {
	width:50%;
    height:90px;
    margin:10px 0;
    float: left;
}

#relations div a {
    color:#333;
    text-decoration:none;
}

#relations div a:hover {
    color:#317b96;
}

#relations div p {
    font-size:11px;
    letter-spacing:1px;
    margin:5px 0;
    padding-right: 2em;
    padding-left: 90px;
}

#relations div img {
    float:left;
    margin:0 20px 0 0;
}

#relations div h3 {
    font-size:14px;
    padding-right: 2em;
}


/***************************
    180306追加／関連商品検索
***************************/
.link-bana a{border:2px solid #317b96; background:#fff; display:block; padding:1.5em;text-decoration:none;text-align:center;font-weight:bold;color:#317b96;}
.link-bana a:hover{background:#317b96;color:#fff;}


/***************************
    GEEストア
***************************/
#gee{
    clear:both;
    padding:0;
    margin:20px 0 20px 0;
    border:1px solid #F26522;
}

#gee ul{
    margin:0;
    padding:20px;
    list-style:none;
}

#gee li {
    color:#333;
    margin-bottom:1px;
}

#gee p {
    font-size:14px;
    margin:0 0 10px 0;
    padding-left:20px;
}

/***************************
    商品バナータグ
***************************/
td.tag img{
    margin-top:5px;
}

.tag h2 {
    color:#666;
    font-size:12px;
    margin:0;
    padding:0 0 0 10px;
    border-left:5px solid #317b96;
}

td.tag{
    font-size:12px;
    line-height:150%;
}

td.tag input {
    font-style:normal;
    border:1px solid #666;
    background-color:#eee;
    width:200px;
    margin-top:5px;
    font-size:10px;
}

/***************************
    091001追加
***************************/

.gonly{
padding:10px 0px;
}
.gonly a,
.gonly a:link,
.gonly a:visited{
padding:10px;
background:#f1f1f1;
border:1px solid #ccc;
}
.gonly a:hover,
.gonly a:active{
padding:10px;
background:#e2e2e4;
border:1px solid #ccc;
}

.sb{
margin:0px;
padding:0px;
}
.sb li{
display:inline;
margin:0px 5px 0px 0px;
padding:0px;
list-style-type:none;
}
.m_mail{
margin:7px 0px 0px;
padding:0px;
}
.m_mail a{
padding:0px 0px 0px 20px;
background:url("http://stage.cospa.com/img/icons/icon_mail.gif") 0 50% no-repeat;
}

.side {
width:100%;
border-width:1px 0 0 1px;
border-style:solid;
border-color:#999;
margin-bottom:20px;
border-right:1px solid #ccc;
border-bottom:1px solid #ccc;
border-collapse:collapse;
}

.side th,.side td {
letter-spacing:1px;
padding:5px 3px 5px 3px;
border-width:0 1px 1px 0;
border-style:solid;
border-color:#999;
}

.side td em {
font-style:normal;
color:#c66;
}

.side th {
font-size:12px;
font-weight:normal;
background-color:#ddd;
text-align:left;
}

.side th.p_item{
width:70px;
text-align:center;
}

.side th.i_item{
width:70px;
}

.side th.r_item{
width:170px;
}

.side th.pr1_item{
width:80px;
}

.side td a {
color:#333;
}

.side td a:hover {
color:#317b96;
}

/***************************
    YouTube動画の縦横比保持
***************************/
.yt-wrapper {
position: relative;
width: 50%;
}
@media screen and (max-width: 768px){
.yt-wrapper{
    width: 100%;
}
}
.yt-wrapper:before {
content:"";
display: block;
padding-top: 56.25%;
}
.yt-wrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.yt-wrapper-img {
width: 50%;
margin:0 0 10px;
}
@media screen and (max-width: 768px){
.yt-wrapper-img{
    width: 100%;
}
}

/*********************************
     もっと見るボタン
*********************************/
.showmore-button {
height: 40px;
width: 100%;
cursor: pointer;
background-color: #fff;
color: #317b96;
text-transform: uppercase;
text-align: center;
padding: 10px 15px;
margin:10px auto;
position: relative;
border: 2px solid #317b96;
}

.showmore-button::after {
content: "もっと見る";
display: block;
width: calc(100% - 12px);
height: calc(100% - 12px);
margin-top: 1.25px;
font-size: 1em;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}

.showmore-button.open::after {
content: "閉じる";
}

#cart_recommend{
overflow:auto;
max-height:350px;
color:#317b96;
}

#cart_recommend div:hover {
opacity: 0.6;
transition-duration: 0.3s;
color:#FF9934;
}

#cart_recommend div p {
color: #000000;
opacity: 1;
}

/** dialog fix **/
.ui-dialog {
    padding: 20px!important;
}
.ui-dialog .ui-dialog-content {
    margin-top: 10px!important;
    padding: 0!important;
}
.ui-dialog .ui-dialog-content div.prod_info h2 {
    margin-top: 20px;
}
#dialog_attention {
    margin-bottom: 10px;
    padding: 10px;
    font-size: 11px;
    color: #E72F29;
    font-weight: bold;
    border: 1px solid #E72F29;
    text-align: justify;
}
#cart_recommend {
    margin-top: 10px;
}
#cart_recommend a {
    display: block;
}
#cart_recommend a:not(:last-of-type) {
    margin-bottom: 10px;
}
.detail05 h2 {
    display: inline-block;
    margin: 10px 0;
    background-color: #317b96;
    border-bottom: 3px solid #6bb5c6;
    margin: 10px 0 3px 0;
    font-size: 15px;
    font-weight: bold;
    color: white;
    padding: 10px 10px;
    width: 100%;
}
.bookmarkbutton {
    display: flex;
    margin: 5px 0 10px 0
}
#root {
    width:100%;
    text-align: center;
}
#bookmark_series_root {
    width:100%;
    text-align: center;
}

/*お気に入りのヘルプアイコン*/
.help_icon {
    height:20px;
    margin-left:5px;
    vertical-align:bottom;
}

/*********************************
     店舗在庫表示
*********************************/
.sold_info_stock{
    float:left;
    margin:0;
    width:100%;
    margin: 0 0 15px 0px;
    background-color: #ECECEC;
    padding: 10px;
    line-height:1.5;
    position: relative;
}
/*下矢印*/
#fireStockCheck.down:before{
    content:"";
    width:8px;
    height:8px;
    border-bottom:2px solid #000;
    border-right:2px solid #000;
    transform:rotate(45deg);
    position:absolute;
    right:15px;
    top: 12px;
}
/*上矢印*/
#fireStockCheck.up:before{
    content:"";
    width:8px;
    height:8px;
    border-top:2px solid #000;
    border-left:2px solid #000;
    transform:rotate(45deg);
    position:absolute;
    right:15px;
    top: 15px;
}



