@charset "utf-8";

.h1_reg {
font-family: 'Roboto Condensed', 'Noto Sans JP', sans-serif!important;
font-weight:lighter;
font-size: 1em;
}

.h2 {
font-family: 'Lora', serif!important;
font-size: 200%;
font-weight: normal;
margin: 5% 0 2%;
}

.h3 span {
font-size: 130%;
padding-bottom: 3px;
border-bottom: 1px solid;
}

@media screen and (max-width:480px) {
h3 span { font-size: 120%; font-weight: bold; line-height: 160%; }
}

main .detail_btn a,
main .detail_btn_s a {
padding: 2% 10%;
border: 2px solid #fff;
display: inline-block;
margin: 6% auto;
}

main .detail_btn_s a {
padding: 2% 4%;
margin: 0 auto;
}

/*　MAIN　*/

#main_img {
margin: 100px 0 0;
text-align: center;
background:linear-gradient(135deg, #fff, #f7f7f7, #f2f1f6, #f1f0f5);
}

#main_img img {
width: 100%;
object-fit: cover;
}


@media screen and (max-width: 736px) {
#main_img { margin: 100px 0 0; }
#main_img img { width: 100%; }
}

@media screen and (max-width: 414px) {
#main_img { margin: 72px 0 0; }
#main_img img { max-width: initial; width: 100%; height:460px; object-position: 5% 50%; object-fit: cover; }
}

#main_img ul{
	margin:0;
	padding:0;
}

.slick-dots{
bottom:15px!important;
}

/*　NEWS　*/

#news {
background: #7a6b58;
color: #fff;
padding: 0.5% 10%;
box-sizing: border-box;
}

#news #news_waku #news_ttl {
margin: 0;
}

#news #news_waku button {
background: url("../img/arrow_off.png") no-repeat center left ;
font-weight: initial;
font-family: inherit;
display: block;
width: 100%;
text-align: left;
padding-left: 30px;
}


#news #news_waku #news_ttl #shikaku {
border: 1px solid #fff;
padding: 6px 10px;
font-size: 90%;
}

#news #news_waku #news_ttl #newsTitle {
font-size: 105%;
}

#news #news_waku #news_ttl img {
width: 20px;
height: 14px;
float: right;
position: relative;
top: 5px;
}


.arrow_on {
background: url("../img/arrow_on.png") no-repeat center right!important ;
}


#news #news_waku #news_text {
margin: 1% 0 0;
font-size: 90%;
border-top: 1px solid #fff;
padding-top: 1%;
display: none;
}

#news #news_waku .d_on {
display: block!important;
}

#news #news_waku #news_text p {
margin-bottom: 1%;
}

#news #news_waku #news_text .news_all {
margin: 1% 0;
}

#news #news_waku #news_text .news_all a {
background: #4a3f31;
padding: 0.5% 1%;
font-size: 90%;
}

@media screen and (max-width: 1024px) {
#news { padding: 0.5% 9%; }
}

@media screen and (max-width: 768px) {
#news { padding: 0.5% 6%; }
}

@media screen and (max-width: 736px) {
#news { padding: 0 3%; }
#news #news_waku #news_ttl #shikaku { padding: 2px 8px; }
#news #news_waku #news_ttl #ttl { font-size: 100%; display: block; }
}

/*　ABOUT　*/

#about {
background: url("../img/top/about.jpg") center no-repeat;
background-size:cover;
padding: 2% 10%;
}

#about #about_waku {
margin: 0 auto;
text-align: center;
padding: 2% 0;
background: rgba(0,0,0,0.5);
}

#about .h2 {
margin: 4% 0 5%;
}

#about #about_waku #about_banner {
display: flex;
width: 100%;
flex-wrap: wrap;
margin: 5% auto 0;
justify-content: center;
}

#about #about_waku #about_banner .banner {
margin: 2px;
}

#about #about_waku #about_banner .banner a img {
width: 240px;
height: auto;
}

#external_link{
background_color: rgba(0,0,0,0.5)
}

#external_banner{
width: 930px;
height: auto;
margin: 60px auto;
display: flex;
}

#external_link #external_banner .banner a img {
padding: 10px;
}

@media screen and (min-width:930px) and (max-width:1280px) {
#about #about_waku #about_banner { width: 70%; }
}

@media screen and (max-width:1024px) {
#about { padding: 2% 8%; }
#about #about_waku #about_banner { width: 85%; }
#about_waku .about_txt { margin: 0 2%; }
}

@media screen and (max-width: 768px) {
#about { padding: 2% 6%; }
#about_waku .about_txt { font-size: 95%; text-align: left; }
#about_waku .about_txt br { display: none; }
}


@media screen and (max-width: 736px) {
#about { padding: 2%; }
#about #about_waku #about_banner { width: 100%; }
#external_banner { width: 85%; display: block; }
}

/*　COLLECTION　*/

#collection {
background: #191919;
margin: 0;
}

#collection #collection_waku {
margin: 0 auto;
text-align: center;
padding: 2% 4%;
width: 100%;
}

#collection #collection_waku .collection_inport {
display: flex;
flex-wrap: wrap;
justify-content: center;
}

#collection #collection_waku .collection_inport .collection_menu img {
width: 300px;
height: auto;
margin: 20px 5px 0;
}

#collection #collection_waku .collection_inport .collection_menu a,
#collection #collection_waku .collection_inport .collection_menu a:visited {
display: inline-block;
position: relative;
padding: 0;
margin: 0;
}


#collection #collection_waku .collection_inport .collection_menu a::before,
#collection #collection_waku .collection_inport .collection_menu a::after {
border-bottom: solid 1px #eee;
bottom: 0;
content: "";
position: absolute;
transition: all 0.5s ease;
width: 0;
}

#collection #collection_waku .collection_inport .collection_menu a::before {
left: 50%;
}

#collection #collection_waku .collection_inport .collection_menu a::after {
right: 50%;
}

#collection #collection_waku .collection_inport .collection_menu a:hover::before,
#collection #collection_waku .collection_inport .collection_menu a:hover::after {
width: 40%;
}

#collection #collection_waku .collection_inport .collection_menu p {
font-size: 80%;
margin-bottom: 0;
}

#collection #collection_waku .collection_inport .collection_menu a:hover {
background: none;
opacity: 1.0;
}

#collection #collection_waku .collection_inport .collection_menu img:hover,
#collection #collection_waku .collection_inport .collection_menu p:hover {
opacity: 0.8;
}


@media screen and (max-width:1024px) {
#collection #collection_waku { padding: 2% 0; }
}

#movie #movie_waku {
margin: 0 auto;
text-align: center;
padding: 5px 0 40px;
background: #0d0d0d
}


/*　MEDIA　*/

#media #media_waku {
margin: 0 auto;
text-align: center;
}

#media #media_waku .media_inport {
display: flex;
width: 100%;
justify-content: center;
}

#media #media_waku .media_inport .media_menu {
margin:0 -1%;
width: 25%;
}

#media #media_waku .media_inport .media_menu .media_img {
height: 83%;
}

#media #media_waku .media_inport .media_menu img {
width: 80%;
height: 100%;
object-fit: cover;
}

#media #media_waku .media_inport .media_menu p {
margin-bottom: 0;
font-size: 85%;
line-height: 140%;
}

#media #media_waku .media_inport .media_menu span {
display: inline-block;
}

#media #media_waku .media_inport .media_menu p .media_ttl {
font-size: 100%;
font-weight: bold;
margin: 3% 0 2%;
}

@media screen and (min-width:980px) and (max-width:1024px) {
#media #media_waku .media_inport .media_menu .media_img { height: 80%; }
}

@media screen and (max-width:979px) {
#media #media_waku .media_inport { flex-wrap: wrap; }
#media #media_waku .media_inport .media_menu { width: 50%; margin: 2% -1% 4%; }
#media #media_waku .media_inport .media_menu .media_img { height: 85%; }
}

@media screen and (max-width:680px) {
#media #media_waku .media_inport .media_menu .media_img { height: 80%; }
}


@media screen and (max-width:480px) {
#media #media_waku .media_inport .media_menu { width: 100%; }
#media #media_waku .media_inport .media_menu p { margin: 0 10% 4%; }
#media #media_waku .media_inport .media_menu .media_img { height: auto; }
}

/*　CONTENTS　*/

#contents {
max-width: 100%;
padding: 0%;
}

#contents #contents_waku {
margin: 0 auto;
}

#contents #container .box-big01 video,
#contents #container .box-big02 video {
width: 100%;
height: auto;
}

#contents #container .item,
#contents #container .item img {
object-fit: contain;
width: 100%;
margin-bottom: -0.5em;
}

#contents #contents_waku #container {
display: grid;
display: -ms-grid;
grid-gap: 0.3em;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
grid-template-rows: auto;
justify-content: center;
align-items: start;
-ms-grid-columns: 1fr 1fr 1fr 1fr 1fr;
-ms-grid-rows: auto;
}

#contents #container .box-big01 {
grid-column: 1 / 3;
grid-row: 2 / 4;
-ms-grid-column-start: 1;
-ms-grid-column-span: 2;
-ms-grid-row: 2;
}

#contents #container .box-big02 {
grid-column: 4 / 6;
grid-row: 1 / 3;
-ms-grid-column: 4;
-ms-grid-row: 1;
}

#contents #container .item:nth-child(1) {
-ms-grid-column: 1;
-ms-grid-row: 1;
}

#contents #container .item:nth-child(2) {
-ms-grid-column: 2;
-ms-grid-row: 1;
}
#contents #container .item:nth-child(3) {
-ms-grid-column: 3;
-ms-grid-row: 1;
}
#contents #container .item:nth-child(4) {
-ms-grid-column: 3;
-ms-grid-row: 2;
}
#contents #container .item:nth-child(5) {
-ms-grid-column: 3;
-ms-grid-row: 3;
}
#contents #container .item:nth-child(6) {
-ms-grid-column: 4;
-ms-grid-row: 3;
}
#contents #container .item:nth-child(7) {
-ms-grid-column: 5;
-ms-grid-row: 3;
}

@media screen and (max-width:667px) {
#contents #contents_waku #container { grid-template-columns: 1fr 1fr 1fr 1fr; }
#contents #container .item, #contents #container .item img { margin-bottom: 0; }
#contents #container .item:nth-child(2),
#contents #container .item:nth-child(4),
#contents #container .item:nth-child(6) { display: none; }
#contents #container .box-big01 { grid-column: 1 / 3; grid-row: 2 / 4; margin-bottom: -0.5em; }
#contents #container .box-big02 { grid-column: 3 / 5; grid-row: 1 / 3; margin-bottom: -0.5em; }
}

@media screen and (max-width:414px) {
#contents #contents_waku #container { grid-template-columns: 1fr 1fr; }
#contents #container .item:nth-child(4), #contents #container .item:nth-child(6) { display: block; }
#contents #container .item:nth-child(5) { grid-column: 1 / 2; grid-row: 4 / 5; }
#contents #container .box-big02 { grid-column: 1 / 3; grid-row: 7 / 9; }
}

/*　NOTES　*/

#notes {
display: flex;
}

#notes #similar_product,
#notes #wholesale {
width: 50%;
padding: 4%
}

#notes #similar_product {
background: #0d0d0d;
}

#notes #wholesale {
background: #090909;
}

@media screen and (max-width:1024px) {
#notes { flex-wrap: wrap; }
#notes #similar_product, #notes #wholesale { width: 100%; }
}
