@charset "utf-8";
@import url(normalize.css);
@import url(common_parts.css);
@import url(common.css);


/* common ----------*/
main { margin:1rem 0 10rem; }
.inner { max-width:128rem; margin:0 auto; padding:0 2rem; }
h3 { position:relative; font-size:2.8rem; border-left:solid 5px #630; background:rgba(102,52,0,0.2); padding:0 0.5em; margin-bottom:3rem; }
h4 { position:relative; font-size:2rem; border-bottom:solid 3px #630; margin:2rem 0; }
section {  }
.block { margin-bottom:10rem; }
.in-cont { margin:2rem 0; }
.flb { display:flex; }
.bold { font-weight: bold; }
.border-top { border-top:solid 1px #630; padding-top:1em; }
section div:after { display:none; }
.anchor { padding-top:10rem; margin-top:-10rem; }
.rev { flex-direction:row-reverse; }
.pen-tx { font-size:2rem; border-bottom:solid 1px #630; padding-bottom:0.5rem; font-weight: bold; }
.pen-tx:before { font-family:"Font Awesome 5 Pro"; font-weight:900; content:"\f304"; display:inline-block; margin-right:1rem; color:#630; }
.min-btn { max-width:25rem; margin:3rem auto 0; text-align:center; border:solid 1px #333; }
.min-btn a { display:block; padding:1rem; color:#333; font-weight: bold; }

@media screen and (max-width:768px){
  .block { margin-bottom:5rem; }
  .anchor { padding-top:8rem; margin-top:-8rem; }
}
@media screen and (max-width:414px){  
  .flb { display:block; }
}

/* common parts ----------*/
.bold-list { margin:2rem 0; font-size:120%; font-weight: bold; }
p.btt { font-size:2rem; font-weight: bold; border-bottom:solid 1px #454545; margin-bottom:2rem; }
.fz20b { font-size:2rem; font-weight: bold; }

/* header */
header .inner { padding:0; }

/* mv ----------*/
#mv {  }
#mv .mv-area { position:relative; }
#mv .text-area { position:absolute; top:5rem; left:0; background:rgba(255,255,255,0.6); max-width:40%; width:100%; }
#mv .text-area h2 { font-size:3rem; padding:2rem 3rem; line-height:1.2; }
@media screen and (max-width:768px){
  #mv .text-area { position:initial; max-width:100%; background:none; margin-top:3rem; }
  #mv .text-area h2 { padding:0; }
}

/* user contents-parts */
.user {  }
.user .inner { position:relative; }
.user .name { position:absolute; top:0; right:2rem; }
.user .name img { max-width:10rem; border-radius:50%; border:solid 1px #454545; margin-bottom:5px; }
.user .name p { text-align:center; }
.user h2 { display:flex; border-left:solid 10px #8D1D1D; font-size:2.6rem; max-width:85%; }
.user h2 span { display:block; padding-left:1em; }
.user .day { display:flex; margin:1rem auto; max-width:95%; }
.user .day p:first-child {  }
.user .day p:first-child:before { font-family:"Font Awesome 5 Pro"; font-weight:900; content:"\f304"; display:inline-block; margin-right:1rem; }
.user .day p:last-child { margin:0; margin-left:2rem; }
.user .day p:last-child:before { font-family:"Font Awesome 5 Pro"; font-weight:900; content:"\f01e"; display:inline-block; margin-right:1rem; }
.user .text-area { max-width:95%; margin:2rem auto; }
.user .text-area .t { border-bottom:solid 1px #454545; font-size:2rem; font-weight: bold; margin-bottom:2rem; }

@media screen and (max-width:600px){
  .user h2 { font-size:2rem; max-width:100%; margin-bottom:2rem; }
  .user .name { position:initial; display:flex; align-items:center; margin-bottom:2rem; }
  .user .name img { margin-bottom:0; margin-right:1rem; max-width:7rem; }
}

/* table contents-parts ----------*/
.table-contents { }
.table-contents h3 { border-left:none; border-bottom:solid 3px #630; }
.table-contents ul { width:90%; margin:0 auto; }
.table-contents ul:nth-of-type(n+2) { margin-top:2rem; }
.table-contents ul li { text-indent:-1em; padding-left:1em; }
.table-contents ul li a { color:#333; }
.table-contents ul li.main { font-size:2rem; border-bottom:solid 2px #630; margin-bottom:1rem; }
.table-contents ul li.main:before { font-family:"Font Awesome 5 Pro"; font-weight:900; content:"\f304"; display:inline-block; margin-right:1rem; }
.table-contents ul li.main a { display:inline-block; padding-right:1em; }
.table-contents ul li.sub { display:block; font-size:1.8rem; text-indent:-1em; padding-left:1em; }

/*.table-contents ul.type-num { counter-reset:num; }*/
.table-contents ul.type-num li { font-size:2rem; border-bottom: solid 2px #630; margin-bottom:2rem; text-indent:-1em; padding-left:1em; }
.table-contents ul.type-num li a { font-weight:bold; }
.table-contents ul.type-num li.sub { border-bottom:none; margin-left:1em; margin-bottom:1rem; }

.table-contents ul.pen {}
.table-contents ul.pen li { text-indent:0em; padding-left:0em; }
.table-contents ul.pen li.main { margin-top:3rem; }
.table-contents ul.pen li.main.fst { margin-top:0; }
.table-contents ul.pen li.main a { display:inline; }

@media screen and (max-width:600px){
  .table-contents ul { width:100%; }
}


/* text-parts ----------*/

/* BigPhoto-parts ----------*/
.big-photo {  }
.big-photo ul {  }
.big-photo ul li { text-align:center; margin-bottom:5rem; }
.big-photo ul li:last-child { margin-bottom:0; }
@media screen and (max-width:414px){
  .big-photo ul li { margin-bottom:3rem; }
}

/* LeftPhoto-parts */
.left-photo .flb { justify-content:space-between; }
.left-photo .img , .left-photo .tx { width:48%; }
.left-photo .type2 .img { width:40%; }
.left-photo .type2 .tx { width:55%; }
.left-photo .img img { object-fit:cover; width:100%; }
@media screen and (max-width:414px){
  .left-photo .img , .left-photo .tx { width:100%!important; }
  .left-photo .img { margin-bottom: 2rem; }
}

/* RightPhoto-parts */
.right-photo .flb { justify-content:space-between; }
.right-photo .img , .right-photo .tx { width:48%; }
.right-photo .type2 .img { width:40%; }
.right-photo .type2 .tx { width:55%; }
.right-photo .img { order:2; }
.right-photo .img img { object-fit:cover; width:100%; }
@media screen and (max-width:414px){
  .right-photo .img , .right-photo .tx { width:100%!important; }
  .right-photo .img { margin-bottom:2rem; }
}

.left-photo .tx .tt , .right-photo .tx .tt { font-weight: bold; font-size:2rem; border-bottom:solid 1px #454545; margin-bottom:1rem; }

/* gallery */
.gallery ul { display:flex; flex-wrap:wrap; width:100%; }
.gallery ul:after { display:none; }
.gallery ul li { width:calc(33.333% - 6rem / 3); margin:0 3rem 3rem 0; }
.gallery ul li:nth-of-type(3n) { margin-right:0; }
@media screen and (max-width:600px){
  .gallery ul li { width:calc(33.333% - 6.666px); margin:0 10px 10px 0; }
}

/* card */
.card {}
.card .box-area { box-shadow:0px 0px 16px -6px #630; padding-top:0; }
.card .box-area p.title { background:#630; color:#fff; font-size:2.4rem; font-weight: bold; padding:0.5rem 2rem; }
.card .box-area .btn { display:inline-block; background:#630; padding:0.5rem 2rem; }
.card .box-area .btn a { display:block; color:#fff; font-size:1.6rem; }
/* 商品紹介時 */
.card .box-area .item-area { display:block; color:#333; }
.card ul.item { display:flex; justify-content:space-between; padding:2rem; }
.card ul.item li {  }
.card ul.item li:first-child { width:30%; }
.card ul.item li:last-child { width:65%; }
.card ul.item li:last-child .title { font-size:2rem; font-weight: bold; margin-bottom:2rem; }
.card ul.item li:last-child .tx { font-size:1.6rem; margin-bottom:2rem; }
.card ul.item li:last-child .price { font-size:1.8rem; font-weight: bold; }
/* カラー展開がある時 */
.card ul.item li:last-child p.color-tt { padding-top:2rem; margin:0.5rem; border-top:solid 1px #630; }
.card ul.item li:last-child ul.color { display:flex; margin-bottom:2rem; }
.card ul.item li:last-child ul.color li { width:2.5rem; height:2.5rem; margin-right:1rem; border-radius:50%; border:solid 1px #aaa; }
.card ul.item li:last-child ul.color li.red { background:#ea000e; }
.card ul.item li:last-child ul.color li.blue { background:#0e6eb8; }
.card ul.item li:last-child ul.color li.ylw { background:#FFF100; }
/* Youtubeリンク時 */
.card .youtube {}
.card .youtube .move { padding:2rem; }
.card .youtube .move-area { position:relative; padding-bottom:56.25%; height:0; overflow:hidden; }
.card .youtube .move-area iframe { width:100%; height:100%; position:absolute; top:0; left:0; }

@media screen and (max-width:768px){
  .card ul.item { display:block; }
  .card ul.item > li:first-child { margin-bottom:2rem; }
  .card ul.item > li:first-child,.card ul.item > li:last-child { width:100%; }
  .card ul.item li:last-child .price { text-align:center; }
  /* sp カラー展開 */
  .card ul.item li:last-child p.color-tt { text-align:center; }
  .card ul.item li:last-child ul.color { justify-content:center; }
}


/* link */
.link .inner{  }
.link ul { display:flex; justify-content:space-between; border-top:solid 5px #630; }
.link ul:after { display:none; }
.link ul li { position:relative; width:30%; text-align:center; margin-top:3rem; border:solid 3px #630; }
.link ul li a { display:flex; justify-content:center; align-items:center; color:#630; font-weight: bold; padding:5rem 2rem 2rem; }
.link ul li span { position:absolute; display:block; width:100%; background:#630; color:#fff; top:0; padding:3px; }
.link ul li.prev span{ left:0; }
.link ul li.next span{ right:0; }

@media screen and (max-width:600px){
  .link ul li { width:45%; }
}

/* light-box css */
.lb-nav a.lb-prev,.lb-nav a.lb-next { opacity:1; }


/* btn-area */
.btn-area {}
.btn-area .btn { max-width:45rem; width:100%; margin:auto; }
.btn-area .btn a { display:block; padding:1rem; border:solid 1px #454545; color:#454545; text-align:center; }


/* youtube */
.youtube { position:relative; height:0; overflow:hidden; padding-bottom:56.25%; }
.youtube iframe { position:absolute; top:0; left:0; width:100%; height:100%; }



