@charset "utf-8";
/* CSS Document */

/*---トップページ---*/
#home { width:100%; overflow:hidden;}
#home h1 { display:none;}

/* メインイメージ用 */
#topimg { width:100%; height:auto; overflow:hidden;}
#topimg .siteimg { width:100%; height:100%; height:100vh; overflow:hidden; z-index:-1;}
#topimg .siteimg p { width:100%; height:100%; height:100vh; background:url(../img/top/siteimg.jpg) center center no-repeat; background-color:transparent; background-size:cover;
transform-origin: 50% 50%;
animation: fadeIn 3s ease 0s 1 normal, sizeScale 3s ease;
-webkit-animation: fadeIn 3s ease 0s 1 normal, sizeScale 3s ease;
}
@keyframes sizeScale {
0% { transform: scale(1.2);}
100% { transform: scale(1.0);}
}
@-webkit-keyframes sizeScale {
0% { transform: scale(1.2);}
100% { transform: scale(1.0);}
}
#topimg .itemimg { position:relative; width:90vw; height:45vw; margin:5vw auto 6.8vw; padding:0;}
#topimg .itemimg .slide-title { position:absolute; top:3vw; right:7vw; left:7vw; z-index:1; line-height:1.2; margin:0; text-align:center; font-size:6.0rem; color:#FFFFFF; font-weight:normal !important; font-family:Georgia, "Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}
/*#topimg .itemimg #slider1 a:hover { text-decoration:none;}*/
/*ul.js-flickity li.slide a { position:absolute; top:0; right:0; bottom:0; left:0; margin:0; padding:0; z-index:1; cursor:pointer !important;}*/
@media all and (max-width:719px)
{
#topimg .itemimg .slide-title { font-size:7.0vw;}
#topimg { height:100vh;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: center;
-webkit-flex-direction:column;
flex-direction:column;}
#topimg .siteimg { width:100%; height:100%;}
#topimg .siteimg p { width:100%; height:100%;}
#topimg .itemimg { flex-shrink:0;}
ul.js-flickity li.slide a { position:relative; /*position:absolute; top:0; right:0; bottom:0; left:0;*/ margin:0; padding:0; z-index:1;}
}

/* ショップインフォ用 */
#home .shopinfo { display:inline-block; margin:0 auto 60px; padding:0 10px; text-align:left; font-size:1.6rem; font-weight:normal !important; font-family:Georgia, "Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}
#home .shopinfo p { text-align:center; font-weight:bold;}

/* コンテンツ･･･スライドイン用 */
/* 基本のスタイル */
.slidecontainerL.delighter { width:100%;
transition: all 0.8s ease;
transform: translateX(-100%);
opacity: 0;
}
.slidecontainerR.delighter { width:100%;
transition: all 0.8s ease;
transform: translateX(100%);
opacity: 0;
}
.slidecontainerU.delighter { width:100%;
transition: all 0.8s ease;
transform: translateY(10%);
opacity: 0;
}
/* スタート時のスタイル */
.slidecontainerL.delighter.started,
.slidecontainerR.delighter.started,
.slidecontainerU.delighter.started {
transform: none;
opacity: 1;
}
/* エンド時のスタイル */
.slidecontainerL.delighter.started.ended,
.slidecontainerR.delighter.started.ended,
.slidecontainerU.delighter.started.ended {
/*border: solid red 10px;*/
}
\
.slidecontainerU a { width:90%; height:45%; margin:0 auto 5%;}
.slidecontainerU a { display:inline-block; width:90vw; height:45vw; margin:0 auto 5vw;}
.slidecontainerU a:hover { text-decoration:none;}

.slidecontainerU .videobox { position:relative; width:90%; height:45%; margin:0 auto 5%; overflow:hidden;}
.slidecontainerU .videobox { width:90vw; height:45vw; margin:0 auto 5vw; overflow:hidden; background-color:#000;}
.slidecontainerU .videobox video { position:absolute; top:-10px; left:0; width:100%; height:115%;}

/* 各要素用 */
.sc-box { width:90%; height:45%; margin:0 auto 5%;}
.sc-box { width:90vw; height:45vw; margin:0 auto 5vw; overflow:hidden;}
.sc-title { margin:8% 0 0;}
.sc-title { margin:19.0vw 0 0; text-align:center; font-size:6.0rem; color:#FFFFFF; font-weight:normal !important; font-family:Georgia, "Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}
.sc-text { margin:0; text-align:center; font-size:3.2rem; color:#FFFFFF; font-weight:normal !important; font-family:Georgia, "Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}
@media all and (max-width:719px)
{
.sc-box {  margin:0 auto;}
.sc-title { margin:15.5vw 0 0; font-size:9.0vw;}
.sc-text { font-size:4.5vw; line-height:1.2;}
}
.top-st { background:url(../img/top/top-st.jpg) center center no-repeat; background-size:cover; overflow:hidden;}
.broo1 { background:url(../img/top/broo1.jpg) center center no-repeat; background-size:cover; overflow:hidden;}
.top-25pd01 { background:url(../img/top/top-25pd01.jpg) center center no-repeat; background-size:cover; overflow:hidden;}
.top-about-1 { background:url(../img/top/top-about-1.jpg) center center no-repeat; background-size:cover; overflow:hidden;}


/* Instagram要素用 */
#instabox { width:90vw; margin:0 auto; padding:0; border:0; list-style:none; text-align:left; font-size:0;}
#instabox li { display:inline-block; vertical-align:top; width:19.5vw; height:19.5vw; margin:0 4vw 4vw 0; padding:0; overflow:hidden;}
#instabox li:nth-of-type(4n) { margin:0 0 4vw 0;}
#instabox li a { display:block; width:19.5vw; height:19.5vw; background-repeat:no-repeat; background-position:center center; background-size:cover;}
#instabox li a:hover { text-decoration:none;}
#instabox li a .post-date { display:none; text-align:center;}
#instabox li a:hover .post-date { display:block; width:19.5vw; height:19.5vw; font-size:12px; color:#FFFFFF; line-height:19.5vw; background-color:rgba(0,0,0,0.65);}
@media all and (max-width:719px)
{
#instabox li { width:43vw; height:43vw; margin:0 4vw 4vw 0; padding:0; overflow:hidden;}
#instabox li:nth-of-type(4n) { margin:0 4vw 4vw 0;}
#instabox li:nth-of-type(2n) { margin:0 0 4vw 0;}
#instabox li a { display:block; width:43vw; height:43vw; background-repeat:no-repeat; background-position:center center; background-size:cover;}
#instabox li a:hover .post-date { width:43vw; height:43vw; font-size:1.2rem; line-height:43vw;}
}


/* ---各ページ動画埋込用--- */
.videobox-s { position:relative; width:63%; height:39.5%; margin:0 auto 5%; overflow:hidden;}
.videobox-s { position:relative; width:63vw; height:35.5vw; margin:0 auto 5vw; overflow:hidden; background-color:#000;}
.videobox-s video { position:absolute; top:0; left:0; width:100%; height:100%;}


/* ---NEWページ用--- */
#new { width:96vw; margin:0 auto; padding:0;}
#n-instabox { margin:0; padding:0; border:0; list-style:none; text-align:left; font-size:0;}
#n-instabox li { display:inline-block; vertical-align:top; width:30vw; height:30vw; margin:0 3vw 3vw 0; padding:0; border:0;}
#n-instabox li:nth-of-type(3n) { margin:0 0 3vw 0;}
#n-instabox li a { display:block; width:30vw; height:30vw; margin:0; padding:0; border:0; background-repeat:no-repeat; background-position:center center; background-size:cover;}
#n-instabox li a:hover { text-decoration:none;}
#n-instabox li a .post-date { display:none; text-align:center;}
#n-instabox li a:hover .post-date { display:block; width:30vw; height:30vw; font-size:12px; color:#FFFFFF; line-height:30vw; background-color:rgba(0,0,0,0.65);}
@media all and (max-width:719px)
{
#n-instabox li { width:47vw; height:47vw; margin:0 2vw 2vw 0; padding:0; overflow:hidden;}
#n-instabox li:nth-of-type(3n) { margin:0 2vw 2vw 0;}
#n-instabox li:nth-of-type(2n) { margin:0 0 2vw 0;}
#n-instabox li a { display:block; width:47vw; height:47vw; background-repeat:no-repeat; background-position:center center; background-size:cover;}
#n-instabox li a:hover .post-date { width:47vw; height:47vw; font-size:1.2rem; line-height:47vw;}
}


/* ---Galleryページ用--- */
#items { margin:0; padding:0;}
#items > #container { position:relative; margin:0 2vw; padding:0;}
#items > #container.navlines2:before { position:relative; display:block; content:"　"; margin:0 0 20px; font-size:18px;}
#items > #container.navlines1:before { position:relative; display:block; content:"　"; margin:0 0 5px; font-size:10px;}
@media all and (max-width:719px)
{
#items > #container { margin:0 2vw;}
#items > #container.navlines2:before { content:"　\A　"; margin:0; white-space:pre; font-size:3.6vw;}
#items > #container.navlines1:before { margin:0; font-size:3.6vw;}
}
/* Gallery-メインナビ用 */
ul#item-navi { position:fixed; width:100%; margin:-40px 0 0; padding:5px 0 2px; list-style:none; font-size:0; z-index:1;background:url(../img/com/bg-body.jpg) repeat center center #E8E5DE;}
ul#item-navi li { display:inline-block; margin:0 2vw 0 0;}
ul#item-navi li:last-of-type { margin:0;}
ul#item-navi li a { display:block; margin:0; padding:0; font-size:22px; color:#000000; font-weight:normal !important; font-family:Georgia, "Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}
ul#item-navi li.item_current a { color:#32B0B1;}
@media all and (max-width:719px)
{
ul#item-navi { margin:-3.5vw 0 0; padding:1.0vw 0;}
ul#item-navi li a { padding:0; font-size:3.0vw/*4.0vw*/;}
}
/* Gallery-サブナビ用 */
ul.item-sub { position:fixed; width:100%; margin:0; padding:0; list-style:none; font-size:0; z-index:1; background-color:#F1F0ED/*rgba(255,255,255,0.6)*/;}
ul.item-sub li { display:inline-block; margin:0 2vw 0 0;}
ul.item-sub li:last-of-type { margin:0;}
ul.item-sub li a { display:block; margin:0; padding:0; font-size:18px; color:#000000; font-weight:normal !important; font-family:Georgia, "Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}
ul.item-sub li.item_current a { color:#32B0B1;}
@media all and (max-width:719px)
{
ul.item-sub { margin:2.5vw 0 0;}
ul.item-sub li a { padding:0; font-size:3.6vw;}
}
/* Gallery-総合indexページ用 */
#items-index { margin:0; padding:0; border:0; list-style:none; text-align:center; font-size:0;}
#items-index li { width:100%; height:auto; margin:0 0 40px;}
#items-index li:last-of-type { margin:0;}
#items-index li a { display:block;}
#items-index li a img { width:100%; height:auto;}
@media all and (max-width:719px)
{
#items-index li { margin:0 0 3vh;}
}
/* Gallery-アイテム別indexページ用 */
#items-subindex { margin:0; padding:0; border:0; list-style:none; text-align:left; font-size:0;}
#items-subindex li { position:relative; padding:0; border:0;}
#items-subindex li img { width:100%; height:auto;}
#items-subindex li a { display:block;}
#items-subindex li a:hover { background-color:rgba(0,0,0,0.9);}
#items-subindex li a:hover img { opacity:0.4;}
#items-subindex li a p { display:none; position:absolute; margin:0; padding:0; text-align:center; font-size:1.2rem; color:#FFFFFF;}
#items-subindex li a:hover p { display:block;}
#items-subindex li a p.item-name { top:50%; right:0; left:0; transform:translateY(-50%);}
#items-subindex li a p.item-price { right:0; bottom:0; left:0; padding:10px 0; background-color:rgba(0,0,0,0.65);}
.line1 li { display:block; width:100%; margin:0 0 2%;}
.line2 li { display:inline-block; vertical-align:top; width:49%; margin:0 2% 2% 0;}
.line2 li:nth-of-type(2n) { margin:0 0 2% 0;}
.line3 li { display:inline-block; vertical-align:top; width:32%; margin:0 2% 2% 0;}
.line3 li:nth-of-type(3n) { margin:0 0 2% 0;}
.line4 li { display:inline-block; vertical-align:top; width:23.5%; margin:0 2% 2% 0;}
.line4 li:nth-of-type(4n) { margin:0 0 2% 0;}
@media all and (max-width:719px)
{
}
/* Gallery-アイテムページ用 */
.item-mainimg { margin-bottom:2vw;}
.item-mainimg img { width:100%;}
#itembox { margin:0; padding:0; border:0; list-style:none; text-align:left; font-size:0;}
#itembox > li { display:inline-block; vertical-align:middle; width:49%; height:auto; margin:0 2% 2% 0; padding:0; border:0; font-size:12px;}
#itembox > li:nth-of-type(2n) { margin:0 0 2% 0;}
#itembox > li img { width:100%; height:auto;}
#itembox > li .item-detail { text-align:center;}
#itembox > li .item-detail table.pd-textbox { width:100%; border-collapse:collapse !important; border-spacing:0 !important; text-align:center;}
#itembox > li .item-detail table.pd-textbox td { padding:15px 10px; border-bottom:#BDB09B 1px solid;}
#itembox > li .item-detail table.pd-textbox td img { width:auto; height:auto;}
#itembox > li .item-detail table.pd-textbox td select.list-box { padding:5px; border:#999999 1px solid;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
#itembox > li .item-detail table.pd-textbox td .style1 { font-weight:bold;}
/*#itembox > li .item-detail p { margin:0; padding:10px; border-bottom:#B6AC87 1px solid;}
#itembox > li .item-detail p.item-name {}
#itembox > li .item-detail p.item-price { font-weight:bold;}
#itembox > li .item-detail p.item-size {}
#itembox > li .item-detail p.item-link {}
#itembox > li .item-detail p.item-desc { text-align:left;}
#itembox > li .item-detail p.item-desc span { display:block; margin:0 0 1em; font-weight:bold;}*/
@media all and (max-width:719px)
{
#itembox > li { display:block; width:100%; margin:0 0 2%; font-size:1.2rem;}
}


/* ---Stockistsページ用--- */
#stockists { margin:0 2vw;}
#stockists h2 { margin:0; padding:0 0 0 10px; border-bottom:#333333 1px solid; font-size:28px; text-align:left; font-weight:normal !important; font-family:Georgia, "Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}
#stockists ul.stockist-box { margin:20px auto 40px; padding:0; list-style:none; text-align:left; font-size:0;}
#stockists ul.stockist-box li { display:inline-block; vertical-align:top; width:22.75%; margin:0 3% 40px 0; padding:0;}
#stockists ul.stockist-box li:nth-of-type(4n) { margin:0 0 40px;}
#stockists ul.stockist-box li a { display:block; margin:0; padding:0; color:#333333; text-align:center; font-weight:bold;}
#stockists ul.stockist-box li a:hover { text-decoration:none;}
#stockists ul.stockist-box li a img { width:100%; height:auto;}
#stockists ul.stockist-box li a .name { margin:5px 0; padding:0 5px; border-bottom:#6D5F32 1px dotted; font-size:14px;}
#stockists ul.stockist-box li a .detail { margin:0 0 5px; padding:5px; font-size:12px;}
/*@media all and (max-width:1023px)
{
#stockists ul.stockist-box li { width:32%; margin:0 2% 40px 0;}
#stockists ul.stockist-box li:nth-of-type(4n) { margin:0 2% 40px 0;}
#stockists ul.stockist-box li:nth-of-type(3n) { margin:0 0 40px;}
}*/
@media all and (max-width:719px)
{
#stockists h2 { font-size:2.6rem;}
#stockists ul.stockist-box li { width:49%; margin:0 2% 40px 0;}
#stockists ul.stockist-box li:nth-of-type(4n) { margin:0 2% 40px 0;}
#stockists ul.stockist-box li:nth-of-type(2n) { margin:0 0 40px;}
#stockists ul.stockist-box li a .name { font-size:1.2rem;}
#stockists ul.stockist-box li a .detail { font-size:1.0rem;}
}
/*@media all and (max-width:419px)
{
#stockists ul.stockist-box li { display:block; width:100%; margin:0 0 40px;}
#stockists ul.stockist-box li:nth-of-type(4n) { margin:0 0 40px;}
#stockists ul.stockist-box li:nth-of-type(3n) { margin:0 0 40px;}
#stockists ul.stockist-box li:nth-of-type(2n) { margin:0 0 40px;}
}*/


/* ---Collaborationsページ用--- */
#collabo { margin:0 2vw;}
#collabo ul.collabo-box { margin:20px auto 40px; padding:0; list-style:none; text-align:left; font-size:0;}
#collabo ul.collabo-box > li { display:inline-block; vertical-align:top; width:47.5%; margin:0 5% 0 0; padding:0; text-align:center; font-size:12px;}
#collabo ul.collabo-box > li:nth-of-type(2n-1) { text-align:left;}
#collabo ul.collabo-box > li:nth-of-type(2n-1) img { display:block; width:auto; max-width:100%; margin:0 auto 40px;}
#collabo ul.collabo-box > li:nth-of-type(2n-1) p.title { margin-bottom:10px; padding-bottom:5px; border-bottom:#000000 1px dashed; font-weight:bold;}
#collabo ul.collabo-box > li:nth-of-type(2n) { margin:0;}
.collabo-photo {}
.collabo-photo .collabo-photo_l { margin:0 0 20px; width:100%;}
.collabo-photo .collabo-photo_l img { display:block; width:auto; max-width:100%;}
.collabo-photo ul { list-style:none; text-align:left; font-size:0;}
.collabo-photo ul li { display:inline-block; width:23.5%; margin:0 2% 5px 0;}
.collabo-photo ul li:nth-of-type(4n) { margin:0 0 5px 0;}
.collabo-photo ul li img { width:100%;}
hr.separator { height:0; margin:30px 0; padding:0; border:0; border-top:#333333 1px solid;}
@media all and (max-width:719px)
{
#collabo ul.collabo-box > li { display:block; width:auto; margin:0; font-size:1.2rem;}
#collabo ul.collabo-box > li:nth-of-type(2n-1) img { margin:0 auto 20px;}
#collabo ul.collabo-box > li:nth-of-type(2n) { margin:20px 0 0;}
}


/* ---Aboutページ用--- */
#about { margin:0 2vw;}
#about .mainimg { margin:0 0 3vw;}
#about .mainimg img { width:100%; height:auto;}
#about ul.aboutimg { margin:0 0 3vw; padding:0; list-style:none; font-size:0;}
#about ul.aboutimg li { display:inline-block; width:30%; margin:0 5% 0 0;}
#about ul.aboutimg li:nth-of-type(3n) { margin:0;}
#about ul.aboutimg li img { width:100%; height:auto;}
#about ul.shopinfo { margin:0 0 3vw; padding:60px 5%; list-style:none; font-size:0; background-color:rgba(255,255,255,0.8);
-moz-border-radius: 10px;    /* 古いFirefox */
-webkit-border-radius: 10px; /* 古いSafari,Chrome */
border-radius: 10px;         /* CSS3 */}
#about ul.shopinfo li { display:inline-block; vertical-align:top; margin:0; text-align:left; font-size:14px;}
#about ul.shopinfo li:nth-of-type(1) { width:55%; margin:0 10% 0 0;}
#about ul.shopinfo li:nth-of-type(2) { width:35%;}
#about ul.shopinfo li h2 { margin:0 0 15px; font-size:18px; font-weight:bold !important; font-family:Georgia, "Times New Roman", Times, serif !important; transform: rotate(.00deg) !important;}
#about ul.shopinfo li h2 span { font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
#about ul.shopinfo li p { margin:0 0 15px; line-height:1.2;}
#about ul.shopinfo li p:last-of-type { margin:0;}
#about ul.shopinfo li .btn-form { width:200px; margin:0; padding:0;}
#about ul.shopinfo li .btn-form img { display:block; margin:0; padding:0;}
@media all and (max-width:719px)
{
#about ul.aboutimg { margin:0 0 5vw;}
#about ul.shopinfo { padding:40px 5%;}
#about ul.shopinfo li { display:block; font-size:1.4rem;}
#about ul.shopinfo li:nth-of-type(1) { width:auto; margin:0 0 40px;}
#about ul.shopinfo li:nth-of-type(2) { width:auto;}
#about ul.shopinfo li h2 { font-size:1.8rem;}
#about ul.shopinfo li .btn-form { margin:25px auto 0 !important; text-align:center;}
}

/*コンタクトフォーム要素--------------------*/
.backlink { width:100%; max-width:800px; text-align:left; margin:0 auto 20px; padding:0 0 0 10px;}
.contact-box { width:100%; max-width:800px; margin:0 auto;}
.contact-box dl { margin:10px 0 0;}
.contact-box dt { float:left; width:200px; margin-bottom:2px; padding:10px 3px 3px; text-align:center;}
.contact-box dd { margin:0 0 2px 0; padding:10px 10px 3px; border-left:200px #BBB498 solid; text-align:left; min-height:30px;}
.contact-box dd img { width:89px; margin:0 0 0 10px;}
.contact-box .ipt-box { border:#999999 1px solid; padding:3px; background-color:#FFFFFF;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
.contact-box .ipt-btn { border:#999999 1px solid; margin:20px; padding:10px 20px; background-color:#EFEFEF;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
.contact-box .msg { color:#FF0000; text-align:center;}
.contact-box .thx { color:#333333; text-align:center;}
.contact-box .error-msg { text-align:center; color:#FF0000;}
.contact-box .catchtext { margin:0 0 20px; font-size:14px; font-size:1.4rem; font-weight:bold;}
@media all and (max-width:719px)
{
.contact-box { width:100%; margin:0 auto;}
.contact-box dl { margin:10px 0 5px;}
.contact-box dt { float:none; width:100%; margin-bottom:2px; padding:5px 10px; text-align:center; background-color:#BBB498;}
.contact-box dd { margin:0 0 10px 0; padding:5px 10px; border:none; text-align:left;}
}

/* ---Letters from Mt.hillページ用--- */
/* indexページ用 */
#letters { margin:0 2vw;}
#letters .letterbox > a { display:block; color:#333333;}
#letters .letterbox > a:hover { text-decoration:none; background-color:rgba(255,255,255,0.3);}
#letters .letterbox h2 { position:relative; margin:0 0 10px; padding:10px; font-size:18px; font-weight:bold; font-weight:normal !important; font-family:Georgia, "Times New Roman", Times, serif !important; transform: rotate(.00deg) !important; background-color:#FFFFFF;}
#letters .letterbox h2 .lb-date { position:absolute; bottom:10px; right:10px; font-size:14px;}
#letters .letterbox .lb-mainimg_box { width:100%; margin:0 auto 15px; padding:0;}
#letters .letterbox .lb-mainimg_box img { width:auto; max-width:100%; margin:0 auto;}
#letters .letterbox .lb-read { margin:0 0 30px; padding:0 0 15px; border-bottom:#564D32 1px dotted; font-size:14px;}
@media all and (max-width:719px)
{
#letters .letterbox h2 { padding:5px; font-size:1.8rem;}
#letters .letterbox h2 .lb-date { position:relative; bottom:auto; right:auto; margin:0; padding:0; text-align:right; font-size:1.4rem;}
#letters .letterbox .lb-mainimg_box { margin:0 auto 5px;}
#letters .letterbox .lb-read { margin:0 0 10px; padding:0 0 10px; font-size:1.4rem;}
}

/* 記事ページ追加用 */
#letters .letterbox ul { margin:0 0 40px; list-style:none; text-align:center; font-size:0;}
#letters .letterbox ul li { margin:0; padding:0; text-align:center; font-size:12px;}
#letters .letterbox ul li img { display:block; width:auto; max-width:100%; margin:0 auto 5px;}
#letters .letterbox ul.b-img_box1 li { width:100%;}
#letters .letterbox ul.b-img_box2 li,
#letters .letterbox ul.b-img_box3 li,
#letters .letterbox ul.b-img_box4 li { display:inline-block; vertical-align:top;}
#letters .letterbox ul.b-img_box2 li { width:47.5%; margin-right:5%;}
#letters .letterbox ul.b-img_box3 li { width:30%; margin-right:5%;}
#letters .letterbox ul.b-img_box4 li { width:21.25%; margin-right:5%;}
#letters .letterbox ul.b-img_box2 li:nth-of-type(2n),
#letters .letterbox ul.b-img_box3 li:nth-of-type(3n),
#letters .letterbox ul.b-img_box4 li:nth-of-type(4n) { margin-right:0;}
#letters .letterbox .textbox { margin:0 0 40px; text-align:center; font-size:12px;}
#letters .letterbox ul li .textbox { margin:40px 0 0; font-size:12px;}
#letters .letterbox hr { height:0; margin:10px 0; padding:0; border:none; border-bottom:#333333 1px dashed;}
#letters .letterbox > hr { margin:0 0 40px !important;}
#letters .backto { width:240px; margin:30px auto; padding:0;}
#letters .backto a { display:block; margin:0; padding:10px; font-size:14px; color:#333333; font-weight:bold; background-color:#FFFFFF;
-moz-border-radius: 5px;    /* 古いFirefox */
-webkit-border-radius: 5px; /* 古いSafari,Chrome */
border-radius: 5px;         /* CSS3 */}
@media all and (max-width:719px)
{
#letters .letterbox ul { margin:0 0 20px;}
#letters .letterbox ul li { font-size:1.2rem;}
#letters .letterbox ul.b-img_box2 li,
#letters .letterbox ul.b-img_box3 li,
#letters .letterbox ul.b-img_box4 li { display:block; width:100%; margin-right:0; margin-bottom:20px;}
#letters .letterbox ul.b-img_box2 li:nth-of-type(2n),
#letters .letterbox ul.b-img_box3 li:nth-of-type(3n),
#letters .letterbox ul.b-img_box4 li:nth-of-type(4n) { margin-bottom:0;}
#letters .letterbox .textbox { margin:0 0 20px; font-size:1.2rem;}
#letters .letterbox ul li .textbox { margin:20px 0 0;}
#letters .letterbox ul li .textbox { font-size:1.2rem;}
#letters .letterbox > hr { margin:0 0 20px !important;}
#letters .backto a { font-size:1.4rem;}
}