@charset "shift-jis";

/*------- PC_start -------*/
@media screen and (min-width: 800px){

    body{
        margin:0;
        font-family: "Lato", "Noto Sans JP", "Yu Gothic black", sans-serif, "メイリオ";;
        background-color: #ffab17;
    }
    #newfair dd,
    #newfair dl{
        margin:0;
    }
    #newfair ul{
        padding:0;
        margin: 0;
    }
    #newfair ul li{
        padding:0;
        list-style:none;
    }
    #newfair .pc_none{
        display:none;
    }
    
/*ベース
================================ */
#newfair .kanban{
    position: relative;
    margin: auto;
    text-align: center;
    width: 100%;
    /*background-image: url(https://ic4-a.wowma.net/mi/w/1280/h/1280/q/90/bcimg1-a.wowma.net/plus/u2539644/pc/common/css/../../image/220818_newfair/title.png);
    background-repeat:no-repeat;*/
}
    
#newfair .kanban img{
    width: 100%;
}
    
#newfair .naiyo {
    max-width: 950px;
    text-align: center;
    margin: 0 auto;
    background: white;
    box-shadow: 0 0 10px #d9d9d9;    
}

#newfair .tyumoku_item ul.col_2 > li > dl > dt,
#newfair .naruhodo_item ul.col_2 > li > dl > dt{
    position: relative;
}

#newfair .tyumoku_item ul.col_2 > li > dl > dt img.cmicon,
#newfair .naruhodo_item ul.col_2 > li > dl > dt img.cmicon{
    position: absolute;
    top: -7%;
    left: 0%;
    width: 25%;
}
    
img, a img {
    width: 100%;
    height: auto;
    vertical-align: bottom;
}  
    
#newfair .tyumoku_item a {
    text-decoration: none;
}  

/*================
コンテンツ
================================*/
#newfair .tyumoku_item,
#newfair .naruhodo_item,
#newfair .huyumono_item,
#newfair .itiosi_item{
    max-width: 900px;
    margin: 0 auto;
}
#newfair .tyumoku_item h2{
	text-align: center;
    font-size: 48px;
    margin: 0;
    color: #fff;
    padding-top: 25px;
    text-shadow: 0px 0px 10px #007e78;
    letter-spacing: 2px;
    line-height: 1.5;
}
#newfair .tyumoku_item h2 span{
    display: block;
    font-size: 20px;
    color: #5a5b5b;
    text-shadow: none;
}
#newfair .w960{
	width:960px;
	margin:0 auto;
}
    
    
/*================
2カラム
================*/
#newfair .tyumoku_item .col_2,
#newfair .naruhodo_item .col_2,
#newfair .huyumono_item .col_2,
#newfair .itiosi_item .col_2{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

#newfair .tyumoku_item .col_2 li,
#newfair .naruhodo_item .col_2 li,
#newfair .huyumono_item .col_2 li,
#newfair .itiosi_item .col_2 li{
    display: inline-block;
    text-align: center;
    /* margin: 2% 2% 5% 2%; */
    width: calc((100% - 8%) / 2);
    position: relative;
    background: #fff3d1;
    padding: 10px;
    margin: 7px;
}

#newfair .tyumoku_item .col_2 li .pt_icon,
#newfair .naruhodo_item .col_2 li .pt_icon,
#newfair .itiosi_item .col_2 li .pt_icon{
    position: absolute;
    top: -2%;
    right: -2%;
}

#newfair .tyumoku_item .col_2 li dl dd.txt_title,
#newfair .naruhodo_item .col_2 li dl dd.txt_title,
#newfair .huyumono_item .col_2 li dl dd.txt_title,
#newfair .itiosi_item .col_2 li dl dd.txt_title{
    font-size: 25px;
    font-weight: bold;
    line-height: 1.1;
    color: #222222;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center; 
    margin-top: 20px;
    margin-bottom: 10px; 
    height: 55px;
}

#newfair .tyumoku_item .col_2 li dl dd.txt_title span,
#newfair .naruhodo_item .col_2 li dl dd.txt_title span,
#newfair .huyumono_item .col_2 li dl dd.txt_title span,
#newfair .itiosi_item .col_2 li dl dd.txt_title span{
	font-size: 20px;
}
    
/*================
アイコン
================*/
#newfair .tyumoku_item .col_2 li dl .icon,
#newfair .naruhodo_item .col_2 li dl .icon,
#newfair .huyumono_item .col_2 li dl .icon,
#newfair .itiosi_item .col_2 li dl .icon{
    display: flex;
    width: 95%;
    margin: 10px auto 0;
}
#newfair .tyumoku_item .col_2 li dl .icon span,
#newfair .naruhodo_item .col_2 li dl .icon span,
#newfair .huyumono_item .col_2 li dl .icon span,
#newfair .itiosi_item .col_2 li dl .icon span{
	display: contents;
	 font-size:16px;
}
#newfair .tyumoku_item .col_2 li dl .icon div[class^="icon_"],
#newfair .naruhodo_item .col_2 li dl .icon div[class^="icon_"],
#newfair .huyumono_item .col_2 li dl .icon div[class^="icon_"],
#newfair .itiosi_item .col_2 li dl .icon div[class^="icon_"]{
    margin-right: 5px;
    width: calc((100% - 6px*2)/3);
    background: #3a3a3a;
    color: #fff;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 58px;
    font-size:19px;
    line-height: 1;
}
#newfair .tyumoku_item .col_2 li dl .icon .icon_3{
	margin-right:0!important;
}
    
/*================
価格
================*/
#newfair .tyumoku_item ul li div[id^="prdisp_t_"],
#newfair .naruhodo_item ul li div[id^="prdisp_t_"],
#newfair .huyumono_item ul li div[id^="prdisp_t_"],
#newfair .itiosi_item ul li div[id^="prdisp_t_"]{
    font-size: 55px;
    font-weight: bold;
    color: #e20025; 
}

#newfair .tyumoku_item ul li dl span.price-tax-txt,
#newfair .naruhodo_item ul li dl span.price-tax-txt,
#newfair .huyumono_item ul li dl span.price-tax-txt,
#newfair .itiosi_item ul li dl span.price-tax-txt{
    font-size: 20px!important;
    margin-right: 6px;
    display: block;
    font-weight: bold!important;
}
    
/*================
詳細はこちら
================*/
#newfair .tyumoku_item ul li dl dd.anchor a,
#newfair .naruhodo_item ul li dl dd.anchor a,
#newfair .huyumono_item ul li dl dd.anchor a,
#newfair .itiosi_item ul li dl dd.anchor a{
    overflow: hidden;
    position: relative;
    font-size: 20px;
    color: #fff;
    letter-spacing: 1px;
    background: #ff7302;
    border-radius: 40px;
    padding: 10px 0;
    margin: 0 auto;
    width: 87%;
    display: block;
    text-decoration: none;
    margin-top: 5px;
}

#newfair .tyumoku_item ul li dl dd.anchor p {
    overflow: hidden;
    position: relative;
    font-size: 20px;
    color: #fff;
    letter-spacing: 1px;
    background: #3b3b3b;
    border-radius: 40px;
    padding: 8px 0;
    margin: 0 auto;
    width: 35%;
    display: block;
    text-decoration: none;
    margin-top: -24px;
    margin-bottom: 25px;
    margin-right: 8px;
}

#newfair .tyumoku_item ul li dl dd.anchor p::before,
#newfair .naruhodo_item ul li dl dd.anchor a::before,
#newfair .huyumono_item ul li dl dd.anchor a::before,
#newfair .itiosi_item ul li dl dd.anchor a::before{
	content: '';
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	transform: skewX(-25deg);
}

#newfair .tyumoku_item ul li dl dd.anchor p:hover::before,
#newfair .naruhodo_item ul li dl dd.anchor a:hover::before,
#newfair .huyumono_item ul li dl dd.anchor a:hover::before,
#newfair .itiosi_item ul li dl dd.anchor a:hover::before{
  animation: shine 0.7s;
}

#newfair .itiosi_item ul li dl dd.anchor a {
    overflow: hidden;
    position: relative;
    font-size: 20px;
    color: #fff;
    letter-spacing: 1px;
    background: #3b3b3b;
    border-radius: 40px;
    padding: 10px 0;
    margin: 0 auto;
    width: 60%;
    display: block;
    text-decoration: none;
    margin-top: 40px;
    margin-bottom: 25px;
}

#newfair .itiosi_item dd {
    padding-bottom: 10px;
}

@keyframes shine {
  100% {
    left: 125%;
  }
}
 
/* おすすめイベント
================================ */
    #newfair .event {
        width: 100%;
        background-color: #fff;
        display: block;
        position: relative;
    }
    
    #newfair .event .event_text {
        font-size: 48px;
        font-weight: bold;
        text-align: center;
        color: #2d2d2d;
        margin: 10px auto;
    }
    
    #newfair .event .event_gazou{
        display: flex;
        flex-wrap:wrap;
    }
    
    #newfair .event .event_gazou li {
        width: calc(100%/4);/*←画像を横に4つ並べる場合*/
        padding:0 5px;/*←画像の左右に5pxの余白を入れる場合*/
        box-sizing:border-box;
    }
    
    #newfair .event .event_gazou .gazou_1 img {
        max-width:100%; /*画像のはみだしを防ぐ*/
        height: auto; /*画像の縦横比を維持 */
        border:solid 1px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
    }
    
    #newfair .event .yudo img {
        width: 850px;
        margin: 5px auto 0;
    }
/* TOP
================================ */
#newfair .pagetop {
    position: fixed;
    bottom: 20px;
    right: 1%;
	font-weight: bold;
	z-index: 1;
    background: #222222;
    border-radius: 180px;	
}
#newfair .pagetop a {
    text-decoration: none;
    display: block;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    transition: all 0.3s ease 0s;
    text-align: center;
    padding: 20px 23px;
    color: #fff;
    border: 1px solid #222222;
}
#newfair .pagetop a:hover {
    text-decoration: none;
	transition: all 0.3s ease 0s;
	background: #fff;
	color:#222222;
}
#newfair .p_onayami {
    bottom: 120px;
    background: none;
    right: 1%;
}
#newfair .p_onayami a{
	padding:0;
}
#newfair .p_onayami a:hover {
    background: none;
    bottom: 140px;    
}

/* 20221114改修
================================ */
/*タイトル*/
#newfair .naiyo .title{
    font-size: 40px;
    font-weight: bold;
    color: #232323;
    letter-spacing: 1px;
    margin: 30px 0 60px;
    position: relative;
    padding-top: 30px;    
}
#newfair .naiyo .title:after{
    content: "";
    position: absolute;
    background: #232323;
    width: 23%;
    bottom: -10%;
    right: 0;
    left: 0;
    margin: auto;
    border-bottom: 3px solid #232323;
}
#newfair .naiyo .title span{
    display: block;
    font-size: 25px;
    line-height: 1;
}

#newfair .price{
    font-size: 40px;
    font-weight: bold;
    color: #e20025;
    font-family: centuryGB, "Century Gothic", helvetica, Arial, sans-serif;
}

/* フッター
================================ */
#newfair .footer {
    margin-top: 3%;
    background: #212121;
    padding: 1% 0;
    text-align: center;
    color: #fff;
    font-size: 17px;
  }
  
#newfair .footer a {
    color: #fff;
    text-decoration: none;
}


}


/*------- SMP_start -------*/
@media screen and (max-width: 799px){

body {
  margin: 0;
}
#newfair {
  margin: 0;
  font-family: "Lato", "Noto Sans JP", "Yu Gothic black", sans-serif, "メイリオ";
  background-color: #ffab17;
}
#newfair dd,
#newfair dl {
  margin: 0;
}
#newfair ul {
  padding: 0;
  margin: 0;
}
#newfair ul li {
  padding: 0;
  list-style: none;
}
#newfair .smp_none {
  display: none;
}

#newfair .smp_none {
  display: none;
}

#newfair a {
  text-decoration: none;
}

#newfair .title {
  position: relative;
}

img,
a img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
    
/*============================
ヘッダー
==============================*/
#newfair .smp_none{
    display:none;
}
    
#newfair a{
    text-decoration: none;
}

#newfair .title{
    position: relative;
}

            
/*コンテンツ
================================*/
#newfair .tyumoku_item,
#newfair .naruhodo_item,
#newfair .huyumono_item,
#newfair .itiosi_item {
  background-size: cover;
  /* padding-bottom: 4vw; */
  background-position-x: center;
  width: 96vw;
  margin: 0 auto;
}

#newfair .tyumoku_item h2 {
  text-align: center;
  font-size: 7vw;
  margin: 0;
  color: #fff;
  padding-top: 25px;
  text-shadow: 0px 0px 10px #007e78;
  letter-spacing: 0.1vw;
  line-height: 1.5;
}

#newfair .tyumoku_item h2 span {
  display: block;
  font-size: 3.5vw;
  color: #5a5b5b;
  text-shadow: none;
}

#newfair .tyumoku_item ul.col_2 > li > dl > dt,
#newfair .naruhodo_item ul.col_2 > li > dl > dt {
  position: relative;
}

#newfair .tyumoku_item ul.col_2 > li > dl > dt img.cmicon,
#newfair .naruhodo_item ul.col_2 > li > dl > dt img.cmicon {
  position: absolute;
  top: -2vw;
  left: -1vw;
  width: 11vw;
}

/* 2カラム
================*/
#newfair .tyumoku_item .col_2,
#newfair .naruhodo_item .col_2,
#newfair .huyumono_item .col_2,
#newfair .itiosi_item .col_2 {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

#newfair .tyumoku_item .col_2 li,
#newfair .naruhodo_item .col_2 li,
#newfair .huyumono_item .col_2 li,
#newfair .itiosi_item .col_2 li {
  display: inline-block;
  text-align: center;
  margin: 1% 1% 3% 1%;
  width: calc((93% - 4%) / 2);
  position: relative;
  background: #fff3d1;
  padding: 1.5vw;
}

#newfair .tyumoku_item .col_2 li .pt_icon,
#newfair .naruhodo_item .col_2 li .pt_icon,
#newfair .huyumono_item .col_2 li .pt_icon,
#newfair .itiosi_item .col_2 li .pt_icon {
  position: absolute;
  top: -2%;
  right: -2%;
}

#newfair .tyumoku_item .col_2 li .pt_icon img,
#newfair .naruhodo_item .col_2 li .pt_icon img,
#newfair .huyumono_item .col_2 li .pt_icon img,
#newfair .itiosi_item .col_2 li .pt_icon img {
  width: 18vw;
}

#newfair .tyumoku_item .col_2 li dl dd.txt_title,
#newfair .naruhodo_item .col_2 li dl dd.txt_title,
#newfair .huyumono_item .col_2 li dl dd.txt_title,
#newfair .itiosi_item .col_2 li dl dd.txt_title {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 3.7vw;
    font-weight: bold;
    line-height: 1.3;
    margin-top: 2vw;
    color: #222222;
    position: relative;
    height: 10vw;
}

#newfair .tyumoku_item .col_2 li dl dd.txt_title span,
#newfair .naruhodo_item .col_2 li dl dd.txt_title span,
#newfair .huyumono_item .col_2 li dl dd.txt_title span,
#newfair .itiosi_item .col_2 li dl dd.txt_title span {
  font-size: 3vw;
  display: block;
}
    
/*　アイコン
================*/
#newfair .tyumoku_item .col_2 li dl .icon,
#newfair .naruhodo_item .col_2 li dl .icon,
#newfair .huyumono_item .col_2 li dl .icon,
#newfair .itiosi_item .col_2 li dl .icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin: 1.3vw auto;
}

#newfair .tyumoku_item .col_2 li dl .icon span,
#newfair .naruhodo_item .col_2 li dl .icon span,
#newfair .huyumono_item .col_2 li dl .icon span,
#newfair .itiosi_item .col_2 li dl .icon span {
  display: contents;
  font-size: 1.2vw;
}

#newfair .tyumoku_item .col_2 li dl .icon div[class^="icon_"],
#newfair .naruhodo_item .col_2 li dl .icon div[class^="icon_"],
#newfair .huyumono_item .col_2 li dl .icon div[class^="icon_"],
#newfair .itiosi_item .col_2 li dl .icon div[class^="icon_"] {
  margin-right: 0.7vw;
  width: calc((100% - 0px * 2) / 3);
  background: #fff;
  color: #3a3a3a;
  border: 1px solid #3a3a3a;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 8.5vw;
  font-size: 2.5vw;
  line-height: 1.2;
  letter-spacing: 0.01em;
}

#newfair .tyumoku_item .col_2 li dl .icon .icon_3 {
  margin-right: 0 !important;
}
    
/*================
価格
================*/
#newfair .tyumoku_item ul li div[id^="prdisp_t_"],
#newfair .naruhodo_item ul li div[id^="prdisp_t_"],
#newfair .huyumono_item ul li div[id^="prdisp_t_"],
#newfair .itiosi_item ul li div[id^="prdisp_t_"]{
    font-size: 6vw;
    font-weight: bold;
    color: #e20025;
}

#newfair .tyumoku_item ul li dl span.price-tax-txt,
#newfair .naruhodo_item ul li dl span.price-tax-txt,
#newfair .huyumono_item ul li dl span.price-tax-txt,
#newfair .itiosi_item ul li dl span.price-tax-txt{
    font-size: 3vw!important;
    margin-right: 6px;
    display: block;
    font-weight: bold!important;
}

#newfair .naruhodo_item .price{
    margin-bottom: 1vw;
}

/* 詳細はこちら
================*/
#newfair .naruhodo_item ul li dl dd.anchor a,
#newfair .huyumono_item ul li dl dd.anchor a,
#newfair .itiosi_item ul li dl dd.anchor a {
  overflow: hidden;
  position: relative;
  font-size: 3.2vw;
  color: #fff;
  letter-spacing: 0.1vw;
  background: #ff7302;
  border-radius: 40px;
  padding: 0.5vw 0;
  margin: 0.5vw auto;
  width: 40vw;
  display: block;
  text-decoration: none;
}

#newfair .tyumoku_item ul li dl dd.anchor p {
  overflow: hidden;
  position: relative;
  font-size: 3.5vw;
  color: #fff;
  letter-spacing: 0.1vw;
  background: #3b3b3b;
  border-radius: 40px;
  padding: 0.5vw 0;
  margin: 0vw auto;
  width: 37vw;
  display: flex;
  text-decoration: none;
  justify-content: center;
  margin-top: -4vw;
  margin-bottom: 3.8vw;
  margin-right: 1vw;
}

#newfair .itiosi_item ul li dl dd.anchor a {
  overflow: hidden;
  position: relative;
  font-size: 3.5vw;
  color: #fff;
  letter-spacing: 0.1vw;
  background: #3b3b3b;
  border-radius: 40px;
  padding: 2vw 0;
  margin: 0vw auto;
  width: 55vw;
  display: flex;
  text-decoration: none;
  justify-content: center;
  margin-top: 2vw;
  margin-bottom: 2.8vw;
}

#newfair .tyumoku_item ul li dl dd.anchor p::before,
#newfair .naruhodo_item ul li dl dd.anchor a::before,
#newfair .huyumono_item ul li dl dd.anchor a::before,
#newfair .itiosi_item ul li dl dd.anchor a::before {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  transform: skewX(-25deg);
}

/* #newfair .tyumoku_item ul li dl dd.anchor a::after,
#newfair .naruhodo_item ul li dl dd.anchor a::after,
#newfair .huyumono_item ul li dl dd.anchor a::after,
#newfair .itiosi_item ul li dl dd.anchor a::after {
  content: "";
  border-style: solid;
  border-width: 1.5vw 0 1.5vw 2vw;
  border-color: transparent transparent transparent #fff;
  position: absolute;
  top: 50%;
  right: 15%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
} */

#newfair .tyumoku_item ul li dl dd.anchor p:hover::before,
#newfair .naruhodo_item ul li dl dd.anchor a:hover::before,
#newfair .huyumono_item ul li dl dd.anchor a:hover::before,
#newfair .itiosi_item ul li dl dd.anchor a:hover::before {
  animation: shine 0.7s;
}

#newfair .itiosi_item dd {
  padding-bottom: 2%;
}

@keyframes shine {
  100% {
    left: 125%;
  }
}
    
/* おすすめイベント
================================ */
        #newfair .event {
            width: 100%;
            background-color: #fff;
            text-align: center;
        }
    
        #newfair .event .event_text {
            font-size: 7vw;
            font-weight: bold;
            text-align: center;
            color: #2d2d2d;
            margin: 1.2vw auto 0.7vw;
        }
    
        #newfair .event .event_gazou .gazou_1 {
            display:inline-block;
            width: calc((100% - 2vw*1)/2);
        }
    
        #newfair .event .event_gazou .gazou_1 img {
            width: 100%;
            margin: 0.7vw;
        }
    
        #newfair .event .yudo img {
            width: 98%;
            margin: 0.7vw auto 0;
        }
    
/* TOP
================================ */
#newfair .pagetop {
    position: fixed;
    bottom: 8%;
    right: 1%;
    font-weight: bold;
    z-index: 1;
    background: #222222;
    border-radius: 180px;
  }
  
  #newfair .pagetop a {
    text-decoration: none;
    display: block;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    transition: all 0.3s ease 0s;
    text-align: center;
    padding: 2vw 3vw;
    color: #fff;
  }
  
  #newfair .pagetop a:hover {
    text-decoration: none;
    transition: all 0.3s ease 0s;
    background: #fff;
    color: #222222;
    border: 0.4vw solid #222222;
  }
  
  #newfair .p_onayami {
    bottom: 120px;
    background: none;
    right: 1%;
  }
  
  #newfair .p_onayami a {
    padding: 0;
  }
  
  #newfair .p_onayami a:hover {
    background: none;
    bottom: 140px;
  }
  
  /* 20221114改修
  ================================ */
  
  #newfair .naiyo {
    width: 97vw;
    margin: 4vw auto;
    background: #fff;
    box-shadow: 0 0 1vw #d9d9d9;
  }
  /*タイトル*/
  #newfair .naiyo .title {
    font-size: 5vw;
    font-weight: bold;
    color: #232323;
    letter-spacing: 0.2vw;
    margin: 0vw 0 6vw;
    position: relative;
    padding-top: 4vw;
    text-align: center;
  }
  #newfair .naiyo .title:after {
    content: "";
    position: absolute;
    background: #232323;
    width: 23%;
    bottom: -10%;
    right: 0;
    left: 0;
    margin: auto;
    border-bottom: 0.5vw solid #232323;
  }
  #newfair .naiyo .title span {
    display: block;
    font-size: 3.5vw;
    line-height: 1;
  }
  #newfair .naiyo ul.col_2 li dl dt > img.item {
    width: 100%;
  }

  #newfair .price{
    font-size: 6vw;
    font-weight: bold;
    color: #e20025;
    font-family: centuryGB, "Century Gothic", helvetica, Arial, sans-serif;
}
  
  /* フッター
  ================================ */
  #newfair .footer {
    background: #212121;
    padding: 5% 0;
    text-align: center;
    color: #fff;
    margin-top: 10%;
  }
  
  #newfair .footer a {
    color: #fff;
    font-size: 4vw;
  }
  
}