/************************************************************/@media only screen and (min-width: 1px) and (max-width: 700px)  {
#sec01{padding: 3% 3% 10% 3%; background: url("Buyer_2022/main_sp.jpg?$staticlink$") no-repeat center top; background-size: cover;}
}
#HEADER .global{display: none;}
#CONTENTS, body:not(.noGlobal) #CONTENTS {margin-left: 0;padding: 0;}
#FOOTER{margin-left: 0;}
#PAGEBODY{padding-bottom: 0;}
.includeSCT .item:hover{
transform:translateY(-5px);
}
.includeSCT .name{margin-top: 8px;font-size: 17px;font-weight: 400;}
.includeSCT .item{box-shadow: 3px 6px 12px rgba(0, 0, 0, .34);}
#lp-content ul.action {display: none;}

.wrap {width:100%;background:#6270CF;}
.wrap p {height:auto;}
#lp-content ul.thumbnail_box-left {display: flex;justify-content: flex-start;flex-wrap: wrap;width: 100%;max-width: 660px;position: absolute;top: 30px;left: 12%;}
#lp-content ul.thumbnail_box-right {display: flex;justify-content: flex-end;flex-wrap: wrap;width: 100%;max-width: 660px;position: absolute;top: 30px;right: 12%;}
.wrap li {margin-bottom: 14px;list-style: none;width: calc((100% - 40px)/2);margin: 10px;box-shadow: 5px 5px 10px rgb(0 0 0 / 45%);transition: all 0.5s;background: #fff;}
.wrap li img {cursor:pointer;transition: all .5s;width: 100%;}
.wrap li:hover img {opacity: 0.8;}

*{box-sizing: border-box;}
a {
transition: all .5s;
-webkit-transition: all .5s;
-moz-transition: all .5s;
text-decoration: none;
    color: #333;
}
a:hover.opa {opacity: .8;}
#lp-content{overflow: hidden;color: #000000;position: relative;line-height: 1.75;font-family: 'Noto Sans JP', sans-serif;font-feature-settings: "palt";}
#lp-content h2 {font-size: 62px;text-align: center;color: #fff;margin: 10% 0 1%;font-weight: 600;letter-spacing: inherit;font-family: 'Noto Sans JP', sans-serif;line-break: strict;overflow-wrap: break-word;word-wrap: break-word;word-break: normal !important;max-width: 1920px;margin: auto;}
#lp-content ul {list-style: none;position: relative;margin: 0;padding: 0;}
.font_small {font-size: 80%;}
.font_ss{font-size: 70%;}
.font_sss{font-size: 62%;}
.font_large {font-size: 120%;}
.font_ll{font-size: 155%;}
.line_center {text-align: center;}
.line_right{text-align: right;}
.line_left{text-align: left;}
.font_bold{font-weight: bold;}
.font_red{color: #dd0000;}
#lp-content img {width: 100%;height: auto;vertical-align: bottom;}
/*========= LoadingのためのCSS ===============*/
/* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
	position: fixed;z-index: 999;width: 100vw;height: 100vh;background:  linear-gradient(130deg, rgba(5,163,133,1) 0%, rgba(2,111,28,1) 38%, rgba(161,189,0,1) 100%);text-align:center;color:#fff;}
/* Loadingバー中央配置　*/
#splash_text {position: absolute;top: 50%;left: 50%;z-index: 999;width: 100%;transform: translate(-50%, -50%);color: #fff;}
/*IE11対策用バーの線の高さ※対応しなければ削除してください*/
#splash_text svg{
    height: 2px;
}
/*=========▲ LoadingのためのCSS▲ ===============*/
#lp-content{position: relative; overflow: hidden;font-family: "ヒラギノ角ゴ Pro W3" , "Hiragino kaku Gothic Pro" , "メイリオ" , Meyryo , "MS Pゴシック" , Osaka , sans-serif;line-break: strict;overflow-wrap: break-word;word-wrap: break-word;word-break: normal !important;position: relative;color: #000;font-family: "ヒラギノ角ゴ Pro W3" , "Hiragino kaku Gothic Pro" , "メイリオ" , Meyryo , "MS Pゴシック" , Osaka , sans-serif;line-height: 1.7;}
section {position: relative;margin: 0 auto;padding: 0;}
.sec-inner {position: relative;max-width: 1290px; width: 96%; margin: 5% auto 0;}
    .other-inner{position: relative;max-width: 1300px; width: 96%; margin: 8% auto;text-align: center;}
#sec01{padding: 3% 3% 10% 3%; background: url("Buyer_2022/main_pc.jpg?$staticlink$") no-repeat center top; background-size: cover;}
.top-txt {width: 70%;margin-left: auto;text-align: center;position: relative;z-index: 1;}
#lp-content h3 {color: #fff;font-size: 32px;font-weight: normal;}
#lp-content h3 img {width: auto;max-width: 100%;}
.sub-title {color: #fff;font-size: 24px;margin-bottom: 10%;display: flex;align-items: center;justify-content: center;}
.sub-title::before, .sub-title::after{content: "";height: 1px;flex-grow: 1;background: #fff;}
.sub-title::before{margin-right: 0.7em;margin-left: 15%}
.sub-title::after{margin-left: 0.7em;margin-right: 15%;}
.lead {margin: 0 auto;text-align: left;color: #fff;font-size: 20px;line-height: 2.2;max-width: 750px;padding: 0 1em;}
.ul-flex{display: flex;flex-wrap: wrap;}
.ul-flex li {position: relative;width: 30%; margin: 1.6%;}
.ul-flex li figure {margin: 0;}
.m_over-blue{position: absolute;height: 100%;width: 38%;background: rgba(48, 163, 131, .7);top: 0;right: 0;transition: all .5s;padding: 5px;display: flex;align-items: center;justify-content:center;}
.m_over-pink{position: absolute;height: 100%;width: 38%;background: rgba(52, 141, 233, .7);top: 0;right: 0;transition: all .5s;padding: 5px;display: flex;align-items: center;justify-content: center;}
.ul-flex li:hover .m_over-blue {width: 100%;background: rgba(48, 163, 131, .9);}
.ul-flex li:hover .m_over-pink {width: 100%;background: rgba(52, 141, 233, .9);}
#lp-content p.co-name {font-size: 16px; color: #fff;text-align: center}
section.mt {padding-top: 100px; margin-top: -100px;}
.brand-box{display: flex;align-items: flex-end;border-bottom: 1px solid #6da5eb;}
.brand-en{margin-left: 1em;font-size: 28px;font-weight: bold;color: #333;}
.brand-title{margin-left: auto;font-size: 36px;font-weight: bold;color: #333;}
.brand_buyer{font-size: 24px;color: #2bb797; font-weight: bold;}
.buyer-box{display: flex;align-items: center;margin-top: 3%;}
.buyer{width: 16%;margin-right: 5px;}
.buyer-comment{width: 36%;position: relative;display: inline-block;margin: 1.5em 0 1.5em 15px;padding: 16px 20px;min-width: 120px;max-width: 100%;font-size: 16px;border: solid 1px #555;box-sizing: border-box;border-radius: 7px;background: #fff;}
.buyer-comment:before{content: "";position: absolute;top: 50%;left: -25px;margin-top: -13px;border: 13px solid transparent;border-right: 12px solid #FFF;z-index: 2;}
.buyer-comment:after{content: ""; position: absolute;top: 50%;left: -28px;margin-top: -14px;border: 14px solid transparent;border-right: 14px solid #555;z-index: 1;}
.buyer-comment p {font-size: 16px;line-height: 1.5;}
.buyer-comment p span {display: block;margin-bottom: 8px;font-size: 17px;font-weight: bold;}
.buyer-title {font-size: 33px;font-weight: bold;width: 46%;margin-left: auto;text-align: right;line-height: 1.6;}
.ab-wrap{position: relative;}
.gallery{position: relative;}
#wrap {display: flex;flex-direction: column;justify-content: center;}
.main_photo {position: relative;overflow: hidden;}
#thumbnail-list {width: 100%;margin: 14px auto 0;display: flex;justify-content:flex-start;flex-wrap: wrap;max-width: 660px;}
.current {background-color: rgba(255, 255, 255, 0.15);border-radius: 5px;}
.ab_sum-right{position: absolute;bottom: -10%;right: 10%;}
.ab_sum-left{position: absolute;bottom: -10%;left: 10%;}
.white-box{background:  rgba(255, 255, 255, .85);padding: 1% 5% 3%;box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.35);width: 71%;}
 .white-box h4 {color: #4d92e8;font-size: 26px;margin:1em auto;}
#lp-content p.sum-txt {font-size: 18px;line-height: 1.8}
.sum-wrap{position: relative;max-width: 1300px; width: 96%; margin: 0 auto;}
.br-01{margin-left: auto;margin-top: 0;}
#lp-content ul.ul-product {display: flex;flex-wrap: wrap;margin-top: 7%;align-items:flex-start;}
#lp-content ul.ul-product-r {display: flex;flex-wrap: wrap;margin-top: 13%;align-items: flex-start;}
.ul-product > li {width: 31.333%;margin-left: 1%;margin-right: 1%;}
.ul-product > li:nth-child(2) {margin-top: 3em;}
.ul-product > li:nth-child(3) {margin-top: 6em;}
.ul-product-r > li {width: 31.333%;margin-left: 1%;margin-right: 1%;}
.ul-product-r > li:first-child {margin-top: 6em;}
.ul-product-r > li:nth-child(2) {margin-top: 3em;}
.s-reco {font-size: 20px;font-weight: bold;color: #09b28b;}
.s-reco i {color: #333;font-size: 30px; margin-right: 5px;}
.pro-price{font-size: 16px;font-weight: bold;color: #DF0000;}
.pro-title{font-size: 18px;}
/*== ボタン共通設定 */
.btn02 {
    /*背景の基点とするためrelativeを指定*/
    position: relative;
    /*ボタンの形状*/
    display: inline-block;
    width:100%;
    height: 62px;
    line-height: 62px;
    text-align: center;
    outline: none;
    font-size: 17px;
    font-weight: bold;
    margin-top: 15px;
}
/*ボタン内側の設定*/
.btn02 span {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    /* 重なりを3Dで表示 */
    transform-style: preserve-3d;
    /* アニメーションの設定 数字が少なくなるほど早く回転 */
    transition: 0.5s;
}
/*== くるっと回転（手前に） */

/* 回転前 */
.rotatefront span:nth-child(1) {
    background: #f1f7ff;
    color: #4d92e8;
    transform: rotateX(0deg);/*はじめは回転なし*/
    transform-origin: 0 50%  -25px;/* 回転する起点 */
    border: 2px solid #4d92e8;
}
/*hoverをした後の形状*/
.rotatefront:hover span:nth-child(1) {
    transform: rotateX(90deg);/* X軸に-90度回転 */
}
/* 回転後 */
.rotatefront span:nth-child(2) {
    background: #4d92e8;
    color: #fff;
    transform: rotateX(-90deg);/*はじめはX軸に90度回転*/
    transform-origin: 0 50%  -25px;/* 回転する起点 */
}
/*hoverをした後の形状*/
.rotatefront:hover span:nth-child(2) {
    transform: rotateX(0deg);/* X軸に0度回転 */
}
.sp-cam {display: none !important;}
.pad-cam {display: none !important;}
.pad-sp {display: none !important;}
.pc-cam {display: block;}
#secOther{background: url("Buyer_2022/bgOther.jpg?$staticlink$") no-repeat center top; background-size: cover;padding: 8% 0;background-attachment: fixed;position: relative;}
    #secOther::before{content: "";position: absolute;top: 0;left: 0; width: 100%;height: 100%;background: rgba(0, 0, 0, .2);}
    .btnOther{font-size:clamp(1.375rem, 1.27rem + 0.48vw, 1.75rem);display: inline-block;padding: 0.8em 3em;border: 2px solid #fff;background: rgba(0, 0, 0, .3);color: #fff;font-size: bold;}
    .btnOther:hover{background: rgba(0, 0, 0, .6);}
    a.btnOther:hover, a.btnOther:focus, a.btnOther:active{color: #fff;}
    .pagesUi.right{z-index: 99;}
    .ken{display: block;font-size: 15px;color: #ffff7b;}
    .chiki{font-size:clamp(1.5rem, 1.285rem + 0.92vw, 2.375rem);color: #4d92e8;font-weight: bold;line-height: 1.1;}

#lp-content .includeSCT .tag .stockLabel .outStock{
    background: red;
    color: #fff;
}


/************************************************************/@media screen and (max-width: 1500px) {
  #lp-content ul.thumbnail_box-left, #lp-content.thumbnail_box-right{width: 80%;}
   #lp-content ul.ml-auto {margin-left: auto;}
    .ab_sum-left.only_naina {position: absolute;bottom: -20%;left: 10%;}

}
/************************************************************/@media screen and (max-width: 1350px) {
  #lp-content ul.thumbnail_box-left, #lp-content.thumbnail_box-right{width: 60%;}
     .white-box h4{font-size: 22px;}
    #lp-content p.sum-txt{font-size: 16px;line-height: 1.6;}
}
/************************************************************/@media screen and (max-width: 1279px) {
  #HEADER .global{display: block;}
}
/************************************************************/@media screen and (max-width: 1100px) {
    .buyer-title{font-size: 32px;}
    #lp-content ul.thumbnail_box-right, #lp-content ul.thumbnail_box-left{right: 0;left: 0;flex-wrap: nowrap;max-width: 100%;}
    #lp-content ul.thumbnail_box-left, #lp-content.thumbnail_box-right{width: 100%;max-width: 100%;flex-wrap: nowrap;}
    .ab_sum-left{left: 3%;}
    .ab_sum-right{right: 3%;}
    .white-box{width: 97%;}
    .wrap li{width: calc((100% - 60px)/6);margin: 10px;}
    .brand-en{line-height: 1.2;}
    .brand-title{line-height: 1.1;}
    .s-reco{font-size: 18px;}
}
@media all and (max-width: 1100px) and (-ms-high-contrast: none) {
 #lp-content ul.thumbnail_box-left, #lp-content.thumbnail_box-right{width: 100%;max-width: 700px;flex-wrap: nowrap;}
}
/************************************************************/@media screen and (max-width: 820px) {
    #lp-content h2{font-size: 38px;}
    #lp-content h3 img{width: 44%;}
    #lp-content h3{font-size: 20px;}
    .lead{font-size: 17px;line-height: 1.8;}
    .ul-flex li{width: 46%;margin: 2%;}
    .buyer-box{flex-wrap: wrap;}
    .buyer{width: 23%;}
    .buyer-comment{width: 70%;}
    .buyer-title{width: 90%;}
    #lp-content ul.thumbnail_box-left{top: 0;}
    .white-box h4{font-size: 20px;margin: 0.7em;}
    .ab_sum-right, .ab_sum-left{bottom: -29%;}
    .ab_sum-left.only_naina{bottom: -33%;}
    #lp-content ul.ul-product{margin-top: 25%;}
    #lp-content ul.ul-product-r{margin-top: 20%;}
    .wrap li {background: none;}
    .brand-box{flex-wrap: wrap;}
.pad-cam {display: block !important;}
.pad-sp {display: block !important;}
.pc-cam {display: none !important;}
.sp-cam {display: none !important;}
    #secOther{background-attachment: scroll;}
}
/************************************************************/@media screen and (max-width: 700px) {
  section#sec01::before{
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, .2);
  }
    #lp-content h2{margin-bottom: 5%;}
    .top-txt{width: 100%;}
    #lp-content h3{font-size: 17px;}
    .m_over-blue, .m_over-pink{width: 45%;}
    #lp-content p.co-name{font-size: 13px;}
    .ul-flex li {width: 48%;margin: 1%;}
    .brand-box{flex-wrap: wrap;}
    .brand_buyer{font-size: 18px;line-height: 1;}
    .brand-en{font-size: 20px;line-height: 1;}
    .brand-title{font-size: 28px;line-height: 1.3;width: 100%;text-align: right;}
    .ab_sum-right,.ab_sum-left, .ab_sum-left.only_naina {position: relative;right: 0;left: 0;}
    .buyer-comment p span{font-size: 16px;}
    #lp-content p{font-size: 14px;line-height: 1.4;}
    .buyer-title{font-size: 19px;line-height: 1.4;width: 100%;}
    #lp-content ul.thumbnail_box-left,#lp-content ul.thumbnail_box-right{position: relative;}
    #lp-content ul.thumbnail_box-left, #lp-content.thumbnail_box-right{flex-wrap: wrap;}
    #lp-content ul.thumbnail_box-left, #lp-content ul.thumbnail_box-right{left: 0;right: 0;top: 0;}
    .wrap{background: none;}
    .wrap li {width: calc((100% - 30px)/3);margin: 5px;}
    .white-box{width: 100%;box-shadow: none;}
    .ul-product > li, .ul-product-r > li{width: 90%;margin-left: auto;margin-right: auto;margin-bottom: 10%;}
    .ul-product > li:nth-child(2), .ul-product > li:nth-child(3), .ul-product-r > li:first-child, .ul-product-r > li:nth-child(2) {margin-top: 0;}
    .s-reco i{font-size: 25px;}
    .s-reco{font-size: 16px;}
    #lp-content ul.ul-product, #lp-content ul.ul-product-r{margin-top: 10%;}
    #lp-content ul.thumbnail_box-right{justify-content: flex-start;flex-wrap: wrap;}    
.sp-cam {display: block !important;}
.pad-sp {display: block !important;}
.pc-cam {display: none !important;}
.pad-cam {display: none !important;}
.pc-pad {display: none !important;}
.btnOther{padding: 0.8em 1.5em;}
    .ken{font-size: 13px;}
}