@charset "UTF-8";
/* æ—¥æœ¬èªž charset "utf-8 */
@keyframes test { 0% { background-position: left center; }
  100% { background-position: -1733px center; } }
@keyframes bg-move { 0% { width: 0; }
  100% { width: 100%; left: 180px; } }
section .btn-more { width: 164px; height: 40px; border: solid 1px black; display: flex; justify-content: space-between; align-items: center; }
section .btn-more:hover { border: solid 1px white; }
section .btn-more:hover p { color: white; }
section .btn-more:hover span { border: solid 1px white; color: black; }
section .btn-more p { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 16px; color: black; }
section .btn-more span { display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; background-color: black; border-left: solid 1px black; color: white; font-size: 20px; }
section .btn-more:hover { border: solid 1px white; background-color: black; }
section .btn-more:hover p { color: white; }
section .btn-more:hover span { border: solid 1px white; color: white; }
section.main-visual { width: 100%; height: 683px; margin-bottom: 101px; position: relative; }
section.main-visual .control { position: absolute; bottom: 0; right: 0; background-color: white; opacity: 0.7; display: flex; justify-content: space-between; align-items: center; width: 164px; height: 40px; padding: 16px; }
section.main-visual .control .slide-count { display: flex; justify-content: space-between; align-items: center; font-size: 16px; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; width: 40%; }
section.main-visual .control .next, section.main-visual .control .prev { cursor: pointer; }
section.topics-content { margin-bottom: 104px; }
section.topics-content .headline { display: flex; justify-content: space-between; align-items: center; margin-bottom: 38px; }
section.topics-content .headline h2 { -webkit-transition: all 0.3s; transition: all 0.3s; position: relative; overflow: hidden; }
section.topics-content .headline h2 span { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 40px; opacity: 0; }
section.topics-content .headline h2 .black { width: 0; height: 100%; top: 0; left: 0; position: absolute; background-color: #000; }
section.topics-content .headline h2.open .black { -webkit-transition: all 0.8s; transition: all 0.8s; width: 100%; }
section.topics-content .headline h2 { -webkit-transition: all 0.3s; transition: all 0.3s; position: relative; overflow: hidden; }
section.topics-content .headline h2 span { opacity: 0; }
section.topics-content .headline h2 .black { width: 0; height: 100%; top: 0; left: 0; position: absolute; background-color: #000; }
section.topics-content .headline h2.open .black { -webkit-transition: all 0.8s; transition: all 0.8s; width: 100%; }
section.topics-content ul.topics-list { display: flex; justify-content: flex-start; }
section.topics-content ul.topics-list li { width: 320px; margin-right: 32px; }
section.topics-content ul.topics-list li:nth-of-type(3n) { margin-right: 0; }
section.topics-content ul.topics-list li a:hover .thumbnail { background-size: 110%; }
section.topics-content ul.topics-list li a:hover .detail-block p.title { opacity: 0.7; font-size: 14px; line-height: 26px; text-decoration: underline; }
section.topics-content ul.topics-list li a .thumbnail { position: relative; background-color: #ccc; background-position: center center; background-repeat: no-repeat; background-size: 100%; padding: 66.5625% 0 0; -webkit-transition: all 0.3s; transition: all 0.3s; margin-bottom: 14px; }
section.topics-content ul.topics-list li a .detail-block .bottom-detail { display: flex; justify-content: space-between; align-items: center; }
section.topics-content ul.topics-list li a .detail-block .bottom-detail .brand-terms { display: flex; justify-content: space-between; align-items: center; }
section.topics-content ul.topics-list li a .detail-block .bottom-detail .brand-terms > p:not(:last-of-type) { margin-right: 10px; }
section.topics-content ul.topics-list li a .detail-block p { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; }
section.topics-content ul.topics-list li a .detail-block p.title { font-family: "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; line-height: 26px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 10px; }
section.topics-content ul.topics-list li a .detail-block p.date { font-size: 14px; line-height: 32px; }
section.topics-content ul.topics-list li a .detail-block p.term { font-size: 14px; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; background-color: black; color: white; padding: 5px 15px; }
section.item-content { margin-bottom: 104px; }
section.item-content .headline { display: flex; justify-content: space-between; align-items: center; margin-bottom: 38px; }
section.item-content .headline h2 { -webkit-transition: all 0.3s; transition: all 0.3s; position: relative; overflow: hidden; }
section.item-content .headline h2 span { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 40px; opacity: 0; }
section.item-content .headline h2 .black { width: 0; height: 100%; top: 0; left: 0; position: absolute; background-color: #000; }
section.item-content .headline h2.open .black { -webkit-transition: all 0.8s; transition: all 0.8s; width: 100%; }
section.item-content ul.item-list { display: flex; justify-content: space-between; flex-wrap: wrap; }
section.item-content ul.item-list li { width: 232px; margin-bottom: 58px; }
section.item-content ul.item-list li a:hover .thumbnail { background-size: 110%; }
section.item-content ul.item-list li a:hover .detail-block p.title { opacity: 0.7; font-size: 14px; line-height: 26px; text-decoration: underline; }
section.item-content ul.item-list li a .thumbnail { position: relative; background-color: #ccc; background-position: center center; background-repeat: no-repeat; background-size: 100%; padding: 119.82759% 0 0; -webkit-transition: all 0.3s; transition: all 0.3s; margin-bottom: 14px; }
section.item-content ul.item-list li a .thumbnail img { width: auto; max-width: 100%; }
section.item-content ul.item-list li a .detail-block p.term { margin-right: 10px; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; line-height: 32px; border-bottom: 1px solid black; display: inline; margin-right: 10px; }
section.item-content ul.item-list li a .detail-block p.title { font-family: "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; line-height: 26px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
section.blog-content { margin-bottom: 104px; }
section.blog-content .headline { display: flex; justify-content: space-between; align-items: center; margin-bottom: 38px; }
section.blog-content .headline h2 { -webkit-transition: all 0.3s; transition: all 0.3s; position: relative; overflow: hidden; }
section.blog-content .headline h2 span { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 40px; opacity: 0; }
section.blog-content .headline h2 .black { width: 0; height: 100%; top: 0; left: 0; position: absolute; background-color: #000; }
section.blog-content .headline h2.open .black { -webkit-transition: all 0.8s; transition: all 0.8s; width: 100%; }
section.blog-content ul.blog-list { display: flex; justify-content: flex-start; }
section.blog-content ul.blog-list li { width: 238px; margin-right: 24px; }
section.blog-content ul.blog-list li:last-of-type { margin-right: 0; }
section.blog-content ul.blog-list li a { overflow: hidden; }
section.blog-content ul.blog-list li a:hover .thumbnail { background-size: 110%; }
section.blog-content ul.blog-list li a:hover .detail-block p.title { opacity: 0.7; font-size: 14px; line-height: 26px; text-decoration: underline; }
section.blog-content ul.blog-list li a .thumbnail { position: relative; background-color: #ccc; background-position: center center; background-repeat: no-repeat; background-size: 100%; padding: 66.66667% 0 0; -webkit-transition: all 0.3s; transition: all 0.3s; }
section.blog-content ul.blog-list li a .thumbnail .border { border-top: 1px solid #efefef; border-left: 1px solid #efefef; border-right: 1px solid #efefef; width: 222px; position: absolute; top: 8px; left: 0; right: 0; bottom: 0; margin: auto; }
section.blog-content ul.blog-list li a .detail-block { width: 222px; border-bottom: 1px solid #efefef; border-left: 1px solid #efefef; border-right: 1px solid #efefef; margin: 0 auto; padding: 12px; }
section.blog-content ul.blog-list li a .detail-block .detail-sub-block { display: flex; justify-content: space-between; align-items: center; }
section.blog-content ul.blog-list li a .detail-block p.title { font-family: "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; line-height: 26px; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: bold; margin-bottom: 34px; }
section.blog-content ul.blog-list li a .detail-block p.date { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; line-height: 26px; margin-right: 20px; }
section.blog-content ul.blog-list li a .detail-block p.term { font-family: "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 14px; line-height: 26px; }
section.instagram-content { margin-bottom: 104px; }
section.instagram-content .headline { display: flex; justify-content: space-between; align-items: center; margin-bottom: 38px; }
section.instagram-content .headline h2 { -webkit-transition: all 0.3s; transition: all 0.3s; position: relative; overflow: hidden; }
section.instagram-content .headline h2 span { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 40px; opacity: 0; }
section.instagram-content .headline h2 .black { width: 0; height: 100%; top: 0; left: 0; position: absolute; background-color: #000; }
section.instagram-content .headline h2.open .black { -webkit-transition: all 0.8s; transition: all 0.8s; width: 100%; }
section.instagram-content .h3-logo-first { text-align: center; margin-top: 32px; margin-bottom: 32px; }
section.instagram-content .h3-logo-first img { width: 84px; display: inline-block; }
section.instagram-content .h3-logo-last { text-align: center; margin-top: 32px; margin-bottom: 32px; }
section.instagram-content .h3-logo-last img { width: 132px; display: inline-block; }
section.instagram-content .instalib { 
  display: flex; 
  justify-content: space-between; 
  /* align-items: center;  */
}
section.instagram-content .instalib li { 
  width: 255px; 
  /* height: 255px;  */
  display: inline-block; 
  background-color: #fff; 
  /* background-color: #8d9191;  */
}
section.instagram-content .instalib li img { width: auto; max-width: 100%;height: 325px;object-fit: cover; }
section.instagram-content .instalib li video { width: auto; max-width: 100%;height: 325px;object-fit: cover; }
section.brand-content { margin-bottom: 104px; }
section.brand-content .headline { display: flex; justify-content: space-between; align-items: center; margin-bottom: 38px; }
section.brand-content .headline h2 { -webkit-transition: all 0.3s; transition: all 0.3s; position: relative; overflow: hidden; }
section.brand-content .headline h2 span { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 40px; opacity: 0; }
section.brand-content .headline h2 .black { width: 0; height: 100%; top: 0; left: 0; position: absolute; background-color: #000; }
section.brand-content .headline h2.open .black { -webkit-transition: all 0.8s; transition: all 0.8s; width: 100%; }
section.brand-content ul.bland-list { display: flex; justify-content: flex-start; flex-wrap: wrap; }
section.brand-content ul.bland-list > li { width: 204px; height: 153px; position: relative; }
section.brand-content ul.bland-list > li:first-of-type a { border-top: solid 1px #eeeeee; border-left: solid 1px #eeeeee; border-bottom: solid 1px #eeeeee; }
section.brand-content ul.bland-list > li:first-of-type a .top-right { border-right: 0; }
section.brand-content ul.bland-list > li:first-of-type a .bottom-right { border-right: 0; }
section.brand-content ul.bland-list > li:nth-child(-n+4) a { border-top: solid 1px #eeeeee; border-left: solid 1px #eeeeee; border-bottom: solid 1px #eeeeee; }
section.brand-content ul.bland-list > li:nth-child(-n+4) a .top-right { border-right: 0; }
section.brand-content ul.bland-list > li:nth-child(-n+4) a .bottom-right { border-right: 0; }
section.brand-content ul.bland-list > li:nth-of-type(5) a { border-top: solid 1px #eeeeee; border-left: solid 1px #eeeeee; border-right: solid 1px #eeeeee; border-bottom: solid 1px #eeeeee; }
section.brand-content ul.bland-list > li:nth-last-of-type(-n+5) a { border-left: solid 1px #eeeeee; border-bottom: solid 1px #eeeeee; }
section.brand-content ul.bland-list > li:nth-last-of-type(-n+5) a .top-right { border-top: 0; border-right: 0; }
section.brand-content ul.bland-list > li:nth-last-of-type(-n+5) a .top-left { border-top: 0; }
section.brand-content ul.bland-list > li:nth-last-of-type(-n+5) a .bottom-right { border-right: 0; }
section.brand-content ul.bland-list > li:last-of-type a { border-right: solid 1px #eeeeee; }
section.brand-content ul.bland-list > li:last-of-type a .top-right { border-right: solid 2px black; }
section.brand-content ul.bland-list > li:last-of-type a .bottom-right { border-right: solid 2px black; }
section.brand-content ul.bland-list > li .top-left, section.brand-content ul.bland-list > li .top-right, section.brand-content ul.bland-list > li .bottom-left, section.brand-content ul.bland-list > li .bottom-right { position: absolute; width: 15px; height: 15px; border: solid 2px black; }
section.brand-content ul.bland-list > li .top-left { border-right: 0; border-bottom: 0; top: 0; left: 0; }
section.brand-content ul.bland-list > li .top-right { border-left: 0; border-bottom: 0; top: 0; right: 0; }
section.brand-content ul.bland-list > li .bottom-left { border-right: 0; border-top: 0; bottom: 0; left: 0; }
section.brand-content ul.bland-list > li .bottom-right { border-left: 0; border-top: 0; bottom: 0; right: 0; }
section.brand-content ul.bland-list > li > a { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; }
section.brand-content ul.bland-list > li > a img { max-width: 104px; }
section.brand-content .bland-slider li { height: auto; }
section.about-content { position: relative; color: white; background-color: #1a1311; overflow: hidden; margin-left: 40px; margin-bottom: 104px; padding-top: 60px; padding-bottom: 60px; background-image: url(../images/front-page/about_bg_text.png); background-repeat: repeat-x; background-position: left center; -moz-animation: test 30s linear 0s infinite; -webkit-animation: test 30s linear 0s infinite; animation: test 30s linear 0s infinite; }
section.about-content .headline { font-size: 32px; text-align: center; width: 100%; margin-bottom: 38px; }
section.about-content .texts { font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; text-align: center; width: 100%; line-height: 40px; margin-bottom: 45px; }
section.about-content .btn-more { width: 164px; height: 40px; border: solid 1px white; display: flex; justify-content: space-between; align-items: center; margin: 0 auto; }
section.about-content .btn-more:hover { border: solid 1px black; }
section.about-content .btn-more:hover p { color: black; }
section.about-content .btn-more:hover span { border: solid 1px black; color: white; }
section.about-content .btn-more p { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-family: "Fjalla One", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; font-size: 16px; color: white; }
section.about-content .btn-more span { display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; background-color: white; border-left: solid 1px white; color: black; font-size: 20px; }
section.about-content .btn-more:hover { border: solid 1px black; background-color: white; }
section.about-content .btn-more:hover p { color: black; }
section.about-content .btn-more:hover span { border: solid 1px black; background-color: white; color: black; }
section.about-content .btn-more span { color: white; background-color: transparent; border-left: solid 1px white; }
section.outside-content { width: 320px; margin: 0 auto; margin-bottom: 104px; }
section.outside-content .bnr-steps { position: relative; display: block; background-image: url(../images/front-page/bnr_steps.png); width: 320px; margin-bottom: 48px; }
section.outside-content .bnr-steps:hover { opacity: 0.6; }
section.outside-content .bnr-steps:after { content: ''; display: block; padding: 27.5% 0 0; }
section.outside-content .bnr-zozo { position: relative; display: block; background-image: url(../images/front-page/bnr_zozo.png); width: 320px; margin-bottom: 48px; }
section.outside-content .bnr-zozo:hover { opacity: 0.6; }
section.outside-content .bnr-raku:hover { opacity: 0.6; }
/* section.outside-content .bnr-zozo:hover { background-image: url(../images/front-page/bnr_zozo_hover.png); } */
section.outside-content .bnr-zozo:after { content: ''; display: block; padding: 27.5% 0 0; }
section.outside-content .sns-block { width: 100%; display: flex; justify-content: space-between; align-items: center; }
section.outside-content .sns-block div { width: 120px; }
section.outside-content .sns-block div .h3-logo-last { margin: 0 auto; margin-bottom: 24px; }
section.outside-content .sns-block div .h3-logo-last img { height: 35px; width: auto; }
section.outside-content .sns-block div:first-of-type .h3-logo-last { width: 76px; }
section.outside-content .sns-block div:last-of-type .h3-logo-last { width: 120px; }
section.outside-content .sns-block div .sns-list { display: flex; justify-content: space-between; align-items: center;width: 70px;margin: 0 auto; }
