@charset "utf-8";

/*
Theme Name: 新潟Tシャツ委員会
Author: THREE
Version: ver 1.00
*/


/* -------------------------------------------------
    ---     COMMON     ---
   -------------------------------------------------  */

@import url(https://fonts.googleapis.com/css?family=Lato:700,400,300,100);


html {
    font-family: 'Lato' ,YuGothic, '游ゴシック', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    -webkit-font-smoothing: antialiased;
    color: #000;
}

body { font-size: 15px; margin: 0; }


::selection {
	background: #4d4d4d;
	color: #fff;
}

a img:hover { opacity: 0.8; }

a {
	color: #eb5b02;
	text-decoration:none;
}

a:hover {
	color: #b54a02;
	text-decoration: none;
}

h2 {
	position: relative;
	padding: 0;
	margin: 1.2em auto;
	background-color: #FFF;
	text-align: center;
	font-size: 2em;
	display: inline-block;
}

h2.underlayer { font-size: 1.5em; margin-top: 5px; text-align: left; }

#main h2 { line-height: 40px; }

h2 span { display: block; padding: .2em .75em; border: 3px solid #000; }

h2::after {
	content: '';
	position: absolute;
	bottom: -20px;
	left: 0;
	width: -webkit-calc(100% - 20px);
	width: calc(100% - 20px);
	height: 0;
	border: 10px solid transparent;
	border-top-color: #000;
}

h3.sub_title { margin: 20px 0; border-bottom: 4px solid #000; font-size: 1.4em; }
h3.sub_title span { font-size: 0.7em; font-weight: normal; }

.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

ul, ul li { list-style: none; padding:0; margin: 0; }



/* -------------------------------------------------
    ---     LAYOUT     ---
   -------------------------------------------------  */

div#wrapper { width: 100%; }
div#main { position: relative; width: 100%; float: right; z-index: 1; }
div#mainContent { margin-left: 200px; }
.sub {
	height: 100%;
	width: 180px;
	margin-right: -200px;
	padding: 10px;
	float: left;
	background:#eb5b02;
	position: fixed;
	overflow: hidden;
	z-index: 9999;

}


div#subContent { height: 1600px;  }

header {
	position: absolute;
	z-index: 3;
	top: 0;
	width: 96%;
	padding: 2%;
	margin-left: -200px;
	font-weight: bold;
}





/* -------------------------------------------------
    ---     HEADER     ---
   -------------------------------------------------  */

nav ul li, #account ul li { float: left; padding:5px; margin-right: 20px; }
nav ul li a, #account ul li a { display: block; color: #000; }
nav ul li a:hover { color: #000; border-bottom: 3px solid #000; }
nav { float: left; }
nav ul li.dummy { width: 200px; margin-right: 0; }
#account { float: right; font-size: 0.8em; }
#account ul li:last-child { padding: 0; }
#account ul li img { width:20px; vertical-align: -5px; margin-right: 3px; }
#account ul li a:hover { color: #666; }
#account ul li a.login { border: 2px solid #000; padding: 5px 10px;  }
#account ul li a.login:hover { color: #000; background: rgba(0,0,0,0.1); }


/* Go Top
-------------------------- */
#go-top{
  display: block;
  position: fixed;
  z-index: 5000;
  bottom: 30px;
  right: 30px;
  width: 60px;
  padding: 10px;
  background: rgba(0,0,0,.7);
  color: #fff;
  text-align: center;
  text-decoration: none;
  border-radius: 5px;
}
#go-top:hover{ background: rgba(0,0,0,.8); }


/* -------------------------------------------------
    ---     SIDE     ---
   -------------------------------------------------  */

a img#logo:hover { opacity: 1; }
img#logo { margin-top: 30px; width: 180px; }
.search-box { width: 176px; height: 21px; padding: 1px; background: #FFF; border: 1px solid #000; margin: 20px 0; }
.search-box p { margin: 0; }
.search-box input.inputbox { float: left;  padding: 3px; width: 147px; border: none; }
.search-box input.searchBtn { float: right; background: #FFF; padding: 4px; }
#side_category ul { padding-left: 0; }
#side_category ul li a {
	color: #FFF;
	font-size: 14px;
	display: block;
	background: url("https://img04.shop-pro.jp/PA01025/117/etc/side_arrow.png") left center no-repeat;
	background-size: 6px auto;
	padding: 9px 9px 7px 12px;
	border-bottom: 1px solid #FFF;
}

#side_category ul li a.sub_ttl {
	background: none;
	font-size: 0.7em;
	color: #f9d8c3;
	border-bottom: 1px dotted #FFF ;
}

#side_category ul li:nth-child(3) a.sub_ttl,
#side_category ul li:nth-child(7) a.sub_ttl,
#side_category ul li:nth-child(10) a.sub_ttl
{ border-bottom: 1px solid #FFF; }

#side_category ul li a:hover {
	background-color: #b54a02;
}

div.side-bnr_nya { margin: 5px 0!important; }
div.side-bnr_nya img { width: 100%; }

div.side-bnr { margin: 10px 0!important; }
div.side-bnr img { width: 100%; }

div.side-bnr2 { 
    margin-top: 5px !important;
    margin-right: 0px !important;
    margin-bottom: 10px !important;
    margin-left: 0px !important;
  }

div.side-bnr2 img { width: 100%; }

/* -------------------------------------------------
    ---     TOP     ---
   -------------------------------------------------  */

div.btn_wrapper { text-align: center; }
a.top_arrow {
	display: inline-block;
	background: url("https://img04.shop-pro.jp/PA01025/117/etc/triangle.png") left center no-repeat;
	background-size: 10px auto;
	padding: 5px 5px 0 20px;
	border-bottom: 1px dashed #eb5b02;
	margin: 20px auto;
}

a.top_arrow:hover {
	background: url("https://img04.shop-pro.jp/PA01025/117/etc/triangle_on.png") left center no-repeat;
	background-size: 10px auto;
	border-bottom: 1px dashed #b54a02;
}

#mainCont { margin:100px 30px 0; }
#mainContLeft { float: left; width: 80%; }
#mainContRight { float: right; width: 20%; }
#mainContLeft section { margin:0 30px 40px 0; }
#mainContLeft section#news, #mainContLeft section#release { text-align: center;  }

#news ul { margin: 10px 0; text-align: left; }
#news ul li { padding:15px 20px; line-height: 1.3; background: #EEEEEF; }
#news ul li span { color: #888; display: inline-block; margin-right: 10px; }
#news ul li:nth-child(2n) { background: none; }
#news ul li a { color: #000; text-decoration: underline; }
#news ul li a:hover { text-decoration: none; }
#release ul li { width: 24.5%; display: inline-block; vertical-align: top; }
#release ul li a { display: block; color: #000; padding: 10px; margin: 10px; }
#release ul li a:hover { background-color: #EEE; }
#release ul li a p { margin: 0; }
#release ul li a p.name { font-weight: bold; margin-top: 5px; }
#release ul li a img { width: 100%; }

#mainContRight div { margin: 30px 0; }
#mainContRight div h3 { margin: 0 0 5px; }
#mainContRight div#real_shop p { font-size: 12px; margin: 0; }
#mainContRight div#real_shop a { color: #000; display: block; padding: 15px; border: 8px solid #EEE; }
#mainContRight div#real_shop a:hover { border: 8px solid #CCC; background: #EEE; }
#mainContRight div#colum { border-top: 1px solid #B4B4B5; border-bottom: 1px solid #B4B4B5; padding: 25px 0; }
#mainContRight div#colum ul li { padding-left: 10px; }
#mainContRight div#colum ul li a { color: #000; }
#mainContRight div#colum ul li a:hover { text-decoration: underline; }

/* --- bxSlider --- */
.bx-wrapper { height: auto!important; }
div.slider { position: relative; }
.bx-wrapper .bx-viewport { background: inherit!important; height: auto; }
ul#bx-pager.bxslider02 { transform:translate3d(-950px, 0px, 0px)!important; }
ul.bxslider01 { margin: 0 auto; }
ul.bxslider01 img { width: 100%; }
ul.bxslider01 li { width: 100%; }
ul.bxslider02 li a {
    display:block;
    width:180px;
    height:auto;
    padding-bottom: 10px;
    border-bottom: 2px solid #FFF;
}

ul.bxslider02 li a img{
    display:block;
    width:180px;
    height:auto;
}

ul.bxslider02 li a:hover { border-bottom: 2px solid #000; }
ul.bxslider02 li a img:hover { opacity: 1; }

div.controlWrap {
    width:100%;
    display:block;
    position:absolute;
    margin:0 auto;
    bottom: -120px;
    z-index: 999;
}

div.controlWrap .bx-viewport { height: auto!important; }

div.controlWrap p#PrevIcon a{
    display:none; /* ボタン仕様時にblockに変更 */
    width:13px;
    height:19px;
    position:absolute;
    background: url(https://img04.shop-pro.jp/PA01025/117/etc/btn_prev.png) left center no-repeat;
    color:#fff;
    top:20px;
    left:20px;
    text-indent:-9999px;
}

div.controlWrap p#NextIcon a{
    display:none; /* ボタン仕様時にblockに変更 */
    width:13px;
    height:19px;
    position:absolute;
    background: url(https://img04.shop-pro.jp/PA01025/117/etc/btn_next.png) left center no-repeat;
    color:#fff;
    top:20px;
    right:20px;
    text-indent:-9999px;
}

div.circle_sns a {
	display: inline-block;
	width: 30px;
	height: 30px;
	border-radius: 30px ;
	margin-right: 8px;
	color: #FFF;
	padding: 5px;
	text-align: center;
}
div.circle_sns a i { font-size: 24px; padding-top: 3px; }
div.circle_sns p { margin: 0 0 10px; }
div.circle_sns a.facebook { background:#2C559E ; }
div.circle_sns a.twitter { background:#368CCD ; }
div.circle_sns a.instagram { background:#00568B ; }
div.circle_sns a.facebook:hover { background:#1f3c70 ; }
div.circle_sns a.twitter:hover { background:#2f76ac ; }
div.circle_sns a.instagram:hover { background:#00426a ; }


/* -------------------------------------------------
    ---     FOOTER     ---
   -------------------------------------------------  */

footer { font-size: 0.8em; text-align: right; padding: 20px; }
footer a { color: #000; }
footer a:hover { color: #999; }

/*
div#copyright { text-align: right; padding: 20px; }
footer ul {
	color: #000;
	background-color: #EEE;
	padding: 0 20px 50px;
	margin-bottom: 0;
	border-top:1px solid #B4B4B5;
	border-bottom:1px solid #B4B4B5;
}

footer ul li:first-child { float: left; padding-top: 50px; }
footer ul li:last-child { float: right; padding-top: 30px; }
footer ul li img.footer_logo { width: 180px; }
footer ul li:first-child p { display: inline-block; margin: 0 0 0 20px; vertical-align: 12px; }
footer ul li:first-child p a { color: #000; }
footer ul li:first-child p a:hover { color: #999; }
*/





/* -------------------------------------------------
    ---     OTHER     ---
   -------------------------------------------------  */

/**
 * Common
 * ----------------------------------------- */
ul.list li {
	display: inline-block;
	width: 24.5%;
	text-align: center;
	position: relative;
	z-index: 1;
	vertical-align: top;
}
ul.list li a { display: block; color: #000; padding: 7px; margin: 7px; border:1px solid #FFF; }
ul.list li a:hover { background: #EEE; }
ul.list li a p { margin: 0; }
ul.list li a p.name { font-weight: bold; margin-top: 15px; }
ul.list li a img { width: 100%;  }
ul.list li a div.thumb { padding: 10px; }
ul.list li a span.line { display: block; height: 2px; background:#000; width: 50px; margin: 10px auto; }
ul.col3 li { width: 33%; }

div.breadlist { margin-bottom: 20px; }
div.breadlist a { color: #000; font-size: 0.8em; display: inline-block; margin: 0 5px; }
div.breadlist a:hover { text-decoration: underline; }

.soldout { color: #F00; font-weight: bold; }
.sub_group { margin: 20px ; padding: 20px; border: 1px solid #000; font-size: 0.8em; border: 1px dotted #000; }
.sub_group a, .change_page a {
	color: #000;
	text-decoration: underline;
	line-height: 1.8;
	display: inline-block;
	margin: 3px 10px;
}
.sub_group a:hover { text-decoration: none; }
.change_list { text-align: center; padding: 20px; font-size: 0.8em; }
.change_page { padding: 20px; margin: 10px 0 30px; background: #EEE; text-align: center; font-size: 0.8em; }

.wrap_ttl { text-align: center; }


/**
 * Ranking
 * ----------------------------------------- */
#ranking ul.list li:before {
	position: absolute;
	z-index: 2;
	top: 20px;
	left: 20px;
	color: #FFF;
	font-weight: bold;
	width: 36px;
	height: 36px;
	text-align: center;
	line-height: 36px;
	border-radius: 36px;
}

ul#ranking01 li:nth-child(1):before { content: "1"; background: #C59A0A; }
ul#ranking01 li:nth-child(2):before { content: "2"; background: #8F989D; }
ul#ranking01 li:nth-child(3):before { content: "3"; background: #A15D17; }

#ranking ul#ranking02 li:before {
	width: 30px;
	height: 30px;
	line-height: 30px;
	border-radius: 30px;
	color: #000;
	background: #FFF;
	border: 1px solid #000;
}

ul#ranking02 li:nth-child(1):before { content: "4"; }
ul#ranking02 li:nth-child(2):before { content: "5"; }
ul#ranking02 li:nth-child(3):before { content: "6"; }
ul#ranking02 li:nth-child(4):before { content: "7"; }
ul#ranking02 li:nth-child(5):before { content: "8"; }
ul#ranking02 li:nth-child(6):before { content: "9"; }
ul#ranking02 li:nth-child(7):before { content: "10"; }
ul#ranking02 li:nth-child(8):before { content: "11"; }
ul#ranking02 li:nth-child(9):before { content: "12"; }
ul#ranking02 li:nth-child(10):before { content: "13"; }
ul#ranking02 li:nth-child(11):before { content: "14"; }
ul#ranking02 li:nth-child(12):before { content: "15"; }


/**
 * Page Detail
 * ----------------------------------------- */

div.MainPhoto {
	width: 100%;
	height: 450px;
	background: #EEE;
	margin-bottom: 20px;
	text-align: center;
}

div.MainPhoto img { display: inline-block; height:410px; width: auto; margin: 20px; }

div.ThumbPhoto { height: auto; }
div.ThumbPhoto li {
	width: 18.4%;
	text-align: center;
	background: #EEE;
	margin-right: 2%;
	float: left;
}
div.ThumbPhoto li:last-child { margin-right: 0; }
div.ThumbPhoto img { height: 78px; width: auto; display: inline-block; padding: 15px; }

div.ProductTxt {
	font-size: 0.9em;
	margin: 30px 0;
	padding: 20px 0;
	border-top: 1px solid #B4B4B4;
	border-bottom: 1px solid #B4B4B4;
}

div.ProductWrap { margin-top: 40px; width: 100%; }
div.dataLeft { float: left; width: 55%; }
div.dataRight { float: right; width: 43%; margin-left: 2%; }
div.ProductWrap .grayTitle { font-size: 0.7em; color: #9E9E9F; }
p.pdtTitle { font-size: 1.5em; font-weight: bold; margin: 0 0 15px; }
p.price { font-size: 1.2em; margin: 0 0 15px; }
div.dataLeft a {
	display: block;
	margin-bottom: 3px;
	font-size: 0.6em;
	color: #000;
	text-decoration: underline;
}
div.dataLeft a:hover { color: #666; text-decoration: none; }
div.dataRight p.gray, div.dataRight div.gray {
	padding: 5px 15px;
	background: #EEE;
	margin: 0 0 7px;
	max-width: 275px;
}

div.dataInner { width: 305px; text-align: left; margin: 0 0 0 auto; }
div.dataInner table { display: inline-block; vertical-align: middle; }

input.cartBtn:hover { opacity:0.7; }

/**
 * Free Page
 * ----------------------------------------- */

.txt_wrap { max-width: 900px; margin: 0 30px; }

img.clm_photo { display: block; margin-bottom: 20px; }

.shopping_guide_main { padding: 20px; border: 1px dotted #000; margin-top: 20px;  }
.shopping_guide_main p { font-weight: bold; }
.shopping_guide_left, shopping_guide_right { float: left; }
.shopping_guide_detail p {
	border-bottom:3px solid #000;
	font-size: 1.2em;
	font-weight: bold;
	margin: 30px 0 10px;
}
.shopping_guide_detail div.sub_ttl {
	border-bottom: 1px dotted #000;
	margin: 20px 0 10px;
	font-weight: bold;
}

#about img { width: 100%; margin: 20px 0; }
#about div.kokoroe_wrap { text-align: center; padding-bottom: 30px; border: 5px solid #000; }
#about div.kokoroe {
	display: inline-block;
	text-align: left;
}

#about h3 { font-size: 1.6em; margin: 20px 0; padding-bottom: 20px; text-align: center; border-bottom: 5px solid #000; }

#store ul li { padding: 15px 20px; }
#store ul li:nth-child(odd) { background: #EEE; }
#store ul li p { font-weight: bold; margin: 0; }

#guide table {
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
	margin: 20px 0;
}

#guide table tr td, #guide table tr th {
	padding: 5px;
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	font-size: 0.9em;
}

#guide .company_left { float: left; }
#guide .company_right { float: right; }

#tokutei table {
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
	margin: 20px 0;
}

#tokutei table tr td, #tokutei table tr th {
	padding: 5px;
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	font-size: 0.9em;
}

#tokutei table tr th { background: #EEE; }
#tokutei h3 { border-bottom: 1px dotted #000; }


/* 小山田委員長Tシャツページ */
ul.sp_t:after { content:""; clear: both; display:block; }
ul.sp_t li { float:left; }
ul.sp_t li img { width: 100%; }
ul.sp_t li:first-child { width: 52%; margin-right: 3%; }
ul.sp_t li:last-child { width: 45%; }
ul.prd { margin: 60px 0; position:relative; }
ul.prd li:first-child { width: 35%; margin-right: 0; }
ul.prd li:last-child { width: 62%; margin-left: 3%; }
ul.prd li p { font-size:1.2em; font-weight: bold; border-bottom: 1px dashed #000; padding-bottom:5px;  }
ul.prd li a.prdBtn {
	display: block;
	border: 3px solid #eb5b02;
	text-align: center;
	color: #eb5b02;
	font-weight: bold;
	position: absolute;
	right: 0;
	bottom: 20px;
	padding: 15px;
	width: 240px;
	margin-top: 20px;
	background: #FFF;
}
ul.prd li a.prdBtn:hover { background:#EEE; }
ul.prd .new_wrapper { position: relative; }
ul.prd .new_wrapper .new {
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 10;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	color: #FFF;
	font-weight: bold;
	background: #C00;
	text-align: center;
	line-height: 80px;
}


/* ------------------------------------------------------------------
 ****
 ****   For Smart Phone
 ****
   ------------------------------------------------------------------ */

/* Larger than Desktop HD */
@media (min-width: 1600px) {

}


@media (max-width: 1200px) {


}

@media (max-width: 1000px) {
ul.prd li a.prdBtn { position: relative; width: 100%; max-width: 240px; bottom: auto; right: auto; }
}

@media screen and (max-width:860px) {

body { font-size: 13px; }


}


@media screen and (max-width:720px) {



}

@media screen and (max-width:480px) {



}


@media screen and (max-width:380px) {



}

@media screen and (max-width:340px) {



}

p.gray_holiday {
background-color: #EEE;
    padding-right: 10px;
    padding-top: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    text-align: center;
    }

/*
Theme Name: にいがた酒の陣
Author: suriya_dojio
*/

#mainContLeft section#sake, 
#mainContLeft section#release { text-align: center;margin-right: 0px;  }

#sake ul { margin: 10px 0; text-align: center; }

#sake ul li { 
padding: 15px 20px;
    line-height: 1.3;
    background: #EEEEEF;
    color: #00184e;
    font-weight: bold;
    font-size: large;
    font-family: '小塚ゴシック Pro','Kozuka Gothic Pro',sans-serif;
}


#sake ul li span { color: #888; display: inline-block; margin-right: 10px; }
#sake ul li:nth-child(2n) { background: none; }
#sake ul li a { color: #000; text-decoration: underline; }
#sake ul li a:hover { text-decoration: none; }

ul.sake_t:after { content:""; clear: both; display:block; }
ul.sake_t li { 
  
  text-align: left;
font-family: a-otf-ryumin-pr6n,serif;
    font-weight: 800;
    font-style: normal;
  color: #00184e;
  margin-bottom: 35px;
}
ul.sake_t li img { width: 100%; }
/*ul.sake_t li:first-child { width: 52%; margin-right: 3%; }
ul.sake_t li:last-child { width: 45%; }*/

ul.prd li a.prdBtn_sake {
  
  display: block;
    border: 3px solid #00184e;
    text-align: center;
    color: #00184e;
    font-weight: bold;
    position: absolute;
    right: 0;
    bottom: 20px;
    padding: 15px;
    width: 240px;
    margin-top: 20px;
    background: #FFF;
  
  
}


/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media screen and (max-width: 750px) {
.niigata_mask_pc { display: none !important; }
.niigata_mask_sp { display: block !important; }
}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */

.niigata_mask_pc { display: block !important; }
.niigata_mask_sp { display: none !important; }

/******トップへスクロールボタンのレイアウトCSS*****/
#scroll-top-button {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
  color: #FFFFFF;
  display: block;
  padding: 20px 10px;
  position: fixed;
  text-align: center;
  text-decoration: none;
  width: 40px;
  z-index: 999;
  border-radius: 5px 5px 5px 5px;
  bottom: 10px;
  right: 10px;
}
#scroll-top-button:hover{
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);　rgba(0,0,0,0.8);
}