@charset "UTF-8";
/*===============
  import
================*/
/*================
default

■styleguide
・デザイン幅(PC)：なし
・コンテンツ幅(PC)：1000px
・デザイン幅(SP)：100%表示
・コンテンツ幅(SP)：なし
・フォントサイズ(PC): 100%=16px;
・フォントサイズ(SP): なし;
================*/
.tc {
  text-align: center !important;
}

.tr {
  text-align: right !important;
}

.tl {
  text-align: left !important;
}

.sp {
  display: block;
}

.pc {
  display: none;
}



/*** wrapper ***/
.wrapper {
  position: relative;
  width: 100%;
  min-width: 320px;
  background: #fff;
  overflow-x: hidden;
}

.wrapper a {
  display: block;
  text-decoration: none;
  transition: opacity .2s ease-in-out;
}

.wrapper .cf::after {
  display: block;
  content: "";
  clear: both;
}

.wrapper h1,
.wrapper h2,
.wrapper h3,
.wrapper h4 {
  margin: 0;
  font-weight: normal;
}

.contents_wrapper {
  padding: 0px;
}

@media screen and (min-width: 1241px){
  .wrapper{
    margin-top:80px;
  }
}

@media screen and (max-width: 1240px){
  .wrapper{
    margin-top:56px;
  }
}

@media screen and (max-width: 1240px) and (max-width: 767px){
  .wrapper{
    margin-top:14.9333333333vw;
  }
}

@media screen and (min-width: 768px) {
  .pc {
    display: block;
  }
  .sp {
    display: none;
  }
  /*** wrapper ***/
  .wrapper {
    width: 100%;
    padding: 0;
    overflow-x: hidden;
    background: #fff;
  }

  .contents_wrapper {
    padding: 0;
  }
  a:hover {
    opacity: .7;
  }
}





/*================
 header
================*/
/*================
default
================*/
.header {
  position: fixed;
  top: -92px;
  left: 0;
  width: 100%;
  z-index: 99;
  height: 75px;
  background: #fbef88;
  padding-top: 0;
  transition: .5s; /* アニメーションタイミング */
}

.header-show {
  top: 0; /* スクロールで表示 */
}
.header .header_inner {
  position: relative;
  margin: 0 auto;
  height: 65px;
  padding: 0% 4% 0% 4%;
  box-sizing: border-box;
  vertical-align: middle;
  text-align: center;
}

.header .header_inner p {
  margin: 0;
}

.header .header_inner .header_logo_01 {
  float: left;
  margin: 13px 0;
  width: 25px;
}

.header .header_inner .header_logo_01 img {
  width: 55px;
}

.header .header_inner .header_logo_02 {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  max-width: 55px;
  margin: 10px 0;
}

.header .header_inner .header_logo_02 img {
  width: 55px;
}

@media screen and (min-width: 1241px){
  .header{
    margin:80px auto 0;
  }
}
#gnav{
  top:172px;
}
@media screen and (max-width: 1240px){
  .header{
    margin:56px auto 0;
  }
  #gnav{
    top:148px;
  }
  
}

@media screen and (max-width: 1240px) and (max-width: 767px){
  .header{
    margin:14.9333333333vw auto 0;
  }
  #gnav{
    top:calc(14.9333333333vw + 75px);
  }
}

@media screen and (min-width: 768px) {
  .header {
    position: fixed;
    width: 100%;
    height: 92px;
  }
  .header .header_inner {
    position: relative;
    width: 100%;
    height: 92px;
    max-width: 1280px;
    padding: 0;
    text-align: center;
  }
  .header .header_inner .header_logo_01 {
    display: inline-block;
    margin-top: 16px;
    padding: 0;
    width: 50px;
  }
  .header .header_inner .header_logo_01 img {
    vertical-align: middle;
    width: 100px;
  }
  .header .header_inner .header_logo_02 {
    position: absolute;
    top: 10px;
    left: 50%;
    padding-top: 0;
    transform: translateX(-50%);
    width: 65px;
  }
  .header .header_inner .header_logo_02 img {
    width: 100%;
  }
}



/*================
default
================*/


#main_content button {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
}

.btn_menu {
  position: absolute;
  top: 0;
  right: 0;
  width: 63px;
  height: 55px;
  display: block;
  background: #fbef88;
  transition: .3s ease all;
}

.btn_menu > * {
  margin: auto;
}

.btn_menu span {
  position: absolute;
  left: 18px;
  display: block;
  width: 27px;
  background: #956114;
  height: 1px;
  transition: .3s ease all;
}

.bar1 {
  top: 27px;
}

.open .bar1 {
  transform: rotate(45deg);
  top: 37px;
}

.bar2 {
  top: 37px;
}

.open .bar2 {
  width: 0;
  left: 50%;
}

.bar3 {
  top: 47px;
}

.open .bar3 {
  transform: rotate(-45deg);
  top: 37px;
}

#gnav {
  width: 65.06667%;
  height: calc(100% - 55px);
  position: fixed;
  right: 0;
  z-index: 9;
  background: #fbef88;
  overflow: auto;
  right: -180px;
  opacity: 0;
  visibility: hidden;
  transition: all ease 0.5s;
}

#gnav.active {
  right: 0;
  opacity: 1;
  visibility: visible;
}

#gnav ul.btn_list {
  margin: calc(57 / 488 * 100%) 0 0;
  padding: 0;
}

#gnav ul.btn_list li {
  text-align: center;
  position: relative;
  font-size: 0;
}

#gnav ul.btn_list li + li::before {
  display: inline-block;
  margin: 0 auto;
  width: 30%;
  height: 2px;
  border-top: 2px solid #fff;
  content: "";
}

#gnav ul.btn_list li a {
  font-size: 3.73333333333vw;
  padding: calc(42 / 488 * 100%) 0;
  display: block;
  color: #38383e;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
}

.example{
  font-size: 0.8em;
  vertical-align: top;
}

.example_02{
  font-size: 0.3em;
  vertical-align: top;
}

/*================
 sns
================*/
.gnav_sns {
  position: relative;
  margin: 0 auto 12%;
  padding: 0;
}

.gnav_sns ul {
  margin: 0 auto;
  padding: 0;
}

.gnav_sns li {
  display: inline-block;
  font-size: 0;
  width: 10.04098%;
}

.gnav_sns li .x_ikon img{
  width: 85%;
}

.gnav_sns li img {
  width: 100%;
}

.gnav_sns li + li {
  margin: 0 0 0 12.70492%;
  width: 9.63115%;
}

@media screen and (min-width: 768px) {
  .btn_menu {
    width: 96px;
    height: 92px;
  }
  .btn_menu > * {
    margin: auto;
  }
  .btn_menu span {
    position: absolute;
    left: 32px;
    display: block;
    width: 32px;
  }
  .bar1 {
    top: 35px;
  }
  .open .bar1 {
    transform: rotate(45deg);
    top: 48px;
  }
  .bar2 {
    top: 46px;
  }
  .open .bar2 {
    width: 0;
    left: 50%;
  }
  .bar3 {
    top: 57px;
  }
  .open .bar3 {
    transform: rotate(-45deg);
    top: 48px;
  }
  #gnav {
    width: 25%;
    height: 99vh;
    position: fixed;
    right: 0;
    z-index: 9;
    background: #fbef88;
    overflow: auto;
    right: -180px;
    opacity: 0;
    visibility: hidden;
    transition: all ease 0.5s;
  }
  #gnav.active {
    right: 0;
    opacity: 1;
    visibility: visible;
  }
  #gnav ul.btn_list {
    margin: 3.33333% 0% 0% 0%;
    padding: 0;
  }
  #gnav ul.btn_list li {
    text-align: center;
    position: relative;
    font-size: 0;
  }
  #gnav ul.btn_list li + li::before {
    display: inline-block;
    margin: 0 auto;
    width: 29%;
    height: 2px;
    border-top: 2px solid #fff;
    content: "";
  }
  #gnav ul.btn_list li a {
    font-size: 1.53vw;
    padding: calc(30 / 300 * 100%) 0;
    display: block;
    color: #38383e;
  }
}
  /*================
  sns
  ================*/
  .gnav_sns {
    position: relative;
    margin: 0 auto;
    padding: 0;
  }
  .gnav_sns ul {
    margin: 0 auto;
    padding: 0;
    width: 90%;
  }
  .gnav_sns li {
    display: inline-block;
    font-size: 0;
    width: 10%;
  }
  .gnav_sns li img {
    width: 100%;
  }
  .gnav_sns .x_ikon img{
    width: 85%;
  }
  .gnav_sns li + li {
    margin: 0 0 0 13%;
    width: 10%;
  }

@media screen and (min-width: 1200px) {
  #gnav ul.btn_list li a {
    font-size: 18px;
  }
}

/*================
 top
================*/

/*================
default
================*/

/*---------- message ---------*/
#message {
  width: 100%;
  background: #e5b2b5;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  background-image:
  radial-gradient(at 39% 83%, hsla(16,63%,88%,0.65) 0px, transparent 50%),
  radial-gradient(at 72% 64%, hsla(304,40%,80%,0.58) 0px, transparent 50%),
  radial-gradient(at 27% 59%, hsla(19,77%,70%,0.44) 0px, transparent 50%),
  radial-gradient(at 77% 44%, hsla(16,63%,88%,0.61) 0px, transparent 50%),
  radial-gradient(at 25% 28%, hsla(304,40%,80%,0.58) 0px, transparent 50%),
  radial-gradient(at 54% 11%, hsla(16,63%,88%,0.5) 0px, transparent 50%),
  radial-gradient(at 78% 19%, hsla(19,77%,70%,0.79) 0px, transparent 50%);

}

#message .inner {
  position: relative;
  margin: 0 auto;
  padding: 0% 0% 44.53333% 0%;
  width: 100%;
  max-width: 1000px;
  box-sizing: border-box;
  background-image: 
    /* left */  
  url("../images/kirakira-C.png"), 
  url("../images/kirakira-A-S.png"), 
  url("../images/kirakira-A-L.png"), 
  /* right */
  url("../images/kirakira-A-M.png"), 
  url("../images/kirakira-C.png"), 
  url("../images/kirakira-A-S.png");
  background-position: 10% 5%, 10% 35%, 7% 85%, 85% 10%, 90% 45%, 90% 95%;
  background-repeat: no-repeat;
  background-size: 8%,5%,9%,5%,7%,6%;

}

#message .sns_content {
  display: none;
}

#message .message_15thlogo{
  margin: 0% auto 7.2%;
  padding: 9.6% 0% 0% 0%;
  width: 30%;
  text-align: center;
}

#message .message_title {
  margin: 0% auto;
  width: 80%;
  box-sizing: border-box;
}

#message .message_text,
#message .message_text_b {
  margin: 8.4% 0% 0% 0%;
  text-align: center;
  color: #fff;
  font-size: 4.2vw;
  line-height: 1.9;
  letter-spacing: 0.08em;
}

#message .message_text_m0,
#message .message_text_b_m0 {
  margin: 0% 0% 0% 0%;
  text-align: center;
  color: #fff;
  line-height: 1.9;
  letter-spacing: 0.08em;
  font-size: 4.2vw;
}

#message .message_text_b,
#message .message_text_b_m0 {
  font-size: 5.6vw;
}

#message .message_text_02 {
  margin: 10.13333% auto 0;
  width: 54.26667%;
  text-align: center;
}

#message .message_logo {
  margin: 11.33333% auto 0;
  width: 10.93333%;
  max-width: 82px;
}

#message .message_img_left_01 {
  position: absolute;
  top: 0;
  left: 0;
  margin: 90% 0% 0% -1%;
  width: 22.26667%;
  max-width: 167px;
}

#message .message_img_left_02 {
  position: absolute;
  top: 0;
  left: 0;
  margin: 155% 0% 0% 1%;
  width: 22.93333%;
  max-width: 187px;
}

#message .message_img_left_03 {
  position: absolute;
  top: 0;
  left: 0;
  margin: 205% 0% 0% 5%;
  width: 34%;
  max-width: 270px;
  z-index: 2;
}

#message .message_img_right_01 {
  position: absolute;
  top: 0;
  right: 0;
  margin: 140% 4% 0% 0%;
  width: 20%;
  max-width: 175px;
}

#message .message_img_right_02 {
  position: absolute;
  top: 0;
  right: 0;
  margin: 197% 0% 0% 0%;
  width: 30%;
  max-width: 151px;
}

#message .message_img_right_03 {
  position: absolute;
  top: 0;
  right: 0;
  margin: 220% 20% 0% 0%;
  width: 26.2%;
  max-width: 234px;
  z-index: 2;
}

/*---------- s01 ---------*/
#s01 {
  width: 100%;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
}

#s01 .inner {
  position: relative;
  margin: 0 auto;
  padding: 0% 0% 0% 0%;
  width: 100%;
  box-sizing: border-box;
}

#s01 .s01_box01_text,
#s01 .s01_box02_text,
#s01 .s01_box03_text {
  margin: 0;
  padding: 0;
  position: absolute;
  top: 50%;
  right: 10.26667%;
  transform: translateY(-50%);
  line-height: 1.769;
  letter-spacing: 0.1em;
  font-size: 3.46667vw;
  font-weight: 600;
  color: #572c17;
}

#s01 .s01_box02_text {
  left: 6.4%;
}

#s01 .s01_box03_text {
  right: 6.93333%;
}

#s01 .s01_box_01,
#s01 .s01_box_02,
#s01 .s01_box_03 {
  position: relative;
}

/*---------- history ---------*/
#history {
  position: relative;
  margin: 0 auto;
  padding: 0;
  width: 100%;
  background: #e5b2b5;
  background-size:contain;
  background-repeat: repeat-y;
  background-image:
  radial-gradient(at 39% 83%, hsla(16,63%,88%,0.65) 0px, transparent 50%),
  radial-gradient(at 72% 64%, hsla(304,40%,80%,0.58) 0px, transparent 50%),
  radial-gradient(at 27% 59%, hsla(19,77%,70%,0.44) 0px, transparent 50%),
  radial-gradient(at 77% 44%, hsla(16,63%,88%,0.61) 0px, transparent 50%),
  radial-gradient(at 25% 28%, hsla(304,40%,80%,0.58) 0px, transparent 50%),
  radial-gradient(at 54% 11%, hsla(16,63%,88%,0.5) 0px, transparent 50%),
  radial-gradient(at 78% 19%, hsla(19,77%,70%,0.79) 0px, transparent 50%);
}

#history .inner{
  margin: 0 auto;
  background-image: 
  /* left */
  url("../images/kirakira-A-L.png"), 
  url("../images/bg_img_turip_02.png"), 
  url("../images/kirakira-C.png"), 
  url("../images/kirakira-A-L.png"), 
  url("../images/kirakira-C.png"), 
  url("../images/kirakira-A-L.png"), 
  url("../images/bg_img_turip_04.png"), 
  url("../images/kirakira-A-L.png"), 
  url("../images/bg_img_turip_05.png"), 
  url("../images/kirakira-A-L.png"),
  /* right */
  url("../images/bg_img_turip_01.png"), 
  url("../images/kirakira-C.png"), 
  url("../images/kirakira-A-L.png"), 
  url("../images/kirakira-A-L.png"), 
  url("../images/bg_img_turip_03.png"), 
  url("../images/kirakira-A-L.png"), 
  url("../images/kirakira-C.png"), 
  url("../images/kirakira-A-L.png"), 
  url("../images/kirakira-A-L.png"), 
  url("../images/kirakira-A-L.png"), 
  url("../images/kirakira-C.png")
  ;
  background-position: 
  /* left */
  20% 0.5%, 
  8% 3.3%, 
  8% 17%, 
  23% 29%, 
  4% 46%, 
  7% 57%, 
  13% 63.5%, 
  22% 76.5%, 
  11% 91%, 
  7% 93%, 
  /* right */
  94% 5.5%, 
  87% 8.3%, 
  94% 14%, 
  85% 22%, 
  95% 36%, 
  80% 41.3%, 
  95% 51.2%, 
  88% 68%, 
  91% 83%, 
  92% 88%, 
  90% 99.5%;
  background-repeat: no-repeat;
  background-size: 
  /* left */
  6%, 9%, 4.5%, 6%, 4.5%, 5%, 18%, 6%, 16%, 5%, 
  /* right */
  13%, 5%, 5.5%, 4%, 10%, 4.5%, 6.8%, 4%, 5%, 4.8%, 6%;
}

#history .inner_box {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  
}

#history .history_title_01 {
  width: 80%;
  max-width: 643px;
  margin: 0% auto 0% auto;
  padding: 18.66667% 0% 0% 0%;
  box-sizing: border-box;
}

#history .history_title_02 {
  display: inline-block;
  font-size: 4.26667vw;
  color: #956114;
  letter-spacing: 0.04em;
  margin: 5.86667% auto 0% auto;
  padding: 0% 0% 2.13333% 0%;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  box-sizing: border-box;
}

#history .history_column {
  position: relative;
  padding: 0% 0% 18.66667% 0%;
  margin: 0;
}

#history .timeline {
  list-style: none;
  margin: 12% auto 0% auto;
  padding: 0;
}

#history .timeline > li {
  overflow: hidden;
  margin: 0;
  position: relative;
  background-image: url("../images/history_line.png");
  background-repeat: no-repeat;
  background-position: 16% 1%;
  background-size: 1% auto;
}

#history .timeline > li.y2011 {
  padding: 0% 0% 9.33333% 0%;
}

#history .timeline > li.y2012 {
  padding: 0% 0% 7.73333% 0%;
}

#history .timeline > li.y2013 {
  padding: 0% 0% 7.73333% 0%;
}

#history .timeline > li.y2014 {
  padding: 0% 0% 9.33333% 0%;
}

#history .timeline > li.y2015 {
  padding: 0% 0% 7.73333% 0%;
}

#history .timeline > li.y2016 {
  padding: 0% 0% 7.73333% 0%;
}

#history .timeline > li.y2018 {
  padding: 0% 0% 7.73333% 0%;
}

#history .timeline > li.y2019 {
  padding: 0% 0% 7.73333% 0%;
}

#history .timeline > li.y2020 {
  padding: 0% 0% 7.73333% 0%;
}
#history .timeline > li.y2021 {
  padding: 0% 0% 7.73333% 0%;
}
#history .timeline > li.y2022 {
  padding: 0% 0% 7.73333% 0%;
}
#history .timeline > li.y2023 {
  padding: 0% 0% 7.73333% 0%;
}
#history .timeline li:first-child {
  padding: 0% 0% 7.73333% 0%;
}

#history .timeline li:last-child {
  background-image: none;
}

#history .history_product {
  width: 24%;
  float: left;
  margin: 0% 0% 0% 4%;
  padding: 1.33333% 0% 1.33333% 0%;
}

#history .history_product.fst {
  padding: 0% 0% 0.8% 0%;
}

#history .timeline_content {
  width: 67.46667%;
  float: left;
  margin: 0% 0% 0% 4.53333%;
  position: relative;
}

#history .timeline_year {
  width: 22.72727%;
  margin: 0;
  padding: 0;
}

#history .timeline_year.y2009 {
  margin: 1.97628% 0% 0% 0%;
}

#history .timeline_year.y2010 {
  margin: 11.46245% 0% 0% 0%;
}

#history .timeline_year + .history_text {
  margin: 4.74308% 0% 0% 0%;
}

#history .history_text {
  font-size: 3.73333vw;
  margin: 1.58103% 0% 0% 0%;
  color: #fff;
  line-height: 1.5;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  letter-spacing: 0;
}

#history .history_text + .history_text {
  margin: 7.11462% 0% 0% 0%;
}

#history .pickup {
  color: #956114;
  margin: 4.74308% 0% 4.74308% 5.92885%;
  padding: 0;
  white-space: pre-wrap;
}

#history .balloon {
  position: relative;
  display: block;
  margin: 4.74308% 0% 0% -5.92885%;
  max-width: 96%;
  border: solid 2px #956114;
  border-radius: 10px;
  box-sizing: border-box;
}

#history .balloon.miniballoon {
  max-width: 80%;
  margin-bottom: 2.4%;
}

#history .balloon:before {
  content: "";
  position: absolute;
  left: -24px;
  top: 50%;
  margin-top: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #e5b2b5;
  border-right: 12px solid #e5b2b5;
  z-index: 2;
}

#history .bln2010:before{
  border-top: 13px solid #E4B6C4;
  border-right: 13px solid #E4B6C4;
  }
  #history .bln2011:before{
    border-top: 13px solid #E2B5C6;
    border-right: 13px solid #E2B5C6;
  }
  #history .bln2014:before{
    border-top: 13px solid #E6B4BD;
    border-right: 13px solid #E6B4BD;
  }
  #history .bln2019:before{
    border-top: 13px solid #ECB8B1;
    border-right: 13px solid #ECB8B1;
  }
  #history .bln2023:before{
    border-top: 13px solid #EBBDB6;
    border-right: 13px solid #EBBDB6;
  }

#history .balloon:after {
  content: "";
  position: absolute;
  left: -30px;
  top: 50%;
  margin-top: -17px;
  border: 14px solid transparent;
  border-top: 13px solid #956114;
  border-right: 14px solid #956114;
  z-index: 1;
}

#history .history_item_10 {
  position: absolute;
  top: 0;
  right: 0;
  width: 26.28458%;
  margin: 59.09091% 7.70751% 0% 0%;
}

#history .history_item_11 {
  position: absolute;
  top: 0;
  right: 0;
  width: 22.13439%;
  margin: 88.73518% 13.63636% 0% 0%;
}

#history .history_item_12 {
  position: absolute;
  top: 0;
  right: 0;
  width: 22.72727%;
  margin: 49.01186% 13.24111% 0% 0%;
}

#history .history_item_13 {
  position: absolute;
  top: 0;
  right: 0;
  width: 22.72727%;
  margin: 99.80237% 28.4585% 0% 0%;
}

#history .history_item_14 {
  position: absolute;
  top: 0;
  right: 0;
  width: 21.5415%;
  margin: 55.73123% 4.94071% 0% 0%;
}

#history .history_item_2015_01 {
  position: absolute;
  top: 0;
  right: 0;
  width: 21.5415%;
  margin: 55.73123% 4.94071% 0% 0%;
}

#history .history_item_15 {
  position: absolute;
  top: 0;
  right: 0;
  width: 23.51779%;
  margin: 42.68775% 5.5336% 0% 0%;
}

#history .history_item_16 {
  position: absolute;
  top: 0;
  right: 0;
  width: 25.88933%;
  margin: 110.47431% 19.76285% 0% 0%;
}

#history .history_item_17 {
  position: absolute;
  top: 0;
  right: 0;
  width: 25.07%;
  margin: 132% 13% 0 0;
}

#history .history_item_18 {
  position: absolute;
  top: 0;
  right: 0;
  width: 30%;
  margin: 200% 15% 0 0;
}

#history .history_item_19 {
  position: absolute;
  top: 0;
  right: 0;
  width: 25%;
  margin: 40% 15% 0 0;
}
#history .history_item_20 {
  position: absolute;
  top: 0;
  right: 0;
  width: 30%;
  margin: 105% 7% 0 0;
}
#history .history_item_21 {
  position: absolute;
  top: 0;
  right: 0;
  width: 30%;
  margin: 105% 7% 0 0;
}
#history .history_item_22 {
  position: absolute;
  top: 0;
  right: 0;
  width: 30%;
  margin: 45% 7% 0 0;
}

#history .history_special_wall {
  width: 92%;
  max-width: 690px;
  margin: 0 auto;
  box-sizing: border-box;
  border: 1.5px solid #956114;
  border-radius: 5px;
  position: relative;
  margin: 8.4% auto 0%;
}


#history .history_special {
  border: 1px solid #956114;
  border-radius: 2px;
  margin: 0.72%;
  padding: 2.94% 4.42%;
}

#history .history_special_text,
#history .gooddesign_text {
  margin: 0;
  padding: 0;
  color: #956114;
  font-size: 4vw;
  line-height: 1.4;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 700;
  letter-spacing: 0;
}

#history .history_special_text a,
#history .gooddesign_text a {
  color: #956114;
}

#history .gooddesign {
  margin: 2.83582% 0 2.83582% 4.58015%;
}

#history .gooddesign_logo {
  width: 40%;
  align-self: center;
  margin-bottom: 4.2%;
  padding: 0;
}


/*---------- sustainability ---------*/

#sustainability {
  position: relative;
  margin: 0 auto;
  padding: 0 0 12%;
  width: 100%;
  max-width: 100%;
  background-image: linear-gradient(179deg, rgba(255, 239, 217, 1), rgba(225, 225, 239, 1));
}

#sustainability .inner_box {
  width: 92%;
  max-width:750px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  color: #956114;
}

#sustainability .sustainability_title_01 {
  width: 80%;
  max-width: 494px;
  margin: 0 auto;
  padding: 13.33333% 0% 0% 0%;
  box-sizing: border-box;
}

#sustainability .sustainability_title_02 {
  font-size: 4.2vw;
  letter-spacing: -0.06em;
  margin: 4.8% auto 0% auto;
  padding: 0% 0% 2.13333% 0%;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  text-align: center;
}


#sustainability .sustainability_title_03 {
  font-size: 4.2vw;
  letter-spacing: 0em;
  margin: 0 auto 7.2% auto;
  padding: 0% 0% 2.13333% 0%;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  font-weight: 500;
  text-align: center;
}

#sustainability .inner_1200{
  line-height: 1.944;
  font-size: 1em;
}

#sustainability .pinkribbon_box{
  background-color: #fdedec;
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  padding-top: 4.8%
}

#sustainability .introduction{
  width: 85.06667%;
  max-width: 750px; 
  margin: 0% auto;
}
#sustainability .pinkribbon_img {
  margin: 7.2% auto;
  width: 30%;
}
#sustainability .pinkribbon_img img{
  width: 100%;
}
#sustainability .pinkribbon_txt{
  font-size: 3.73333vw;
  text-align: justify;
  padding-top:  4.8%;
}
#sustainability .sub_title{
  font-size: 7.2vw;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  line-height: 1;
  margin-bottom: 0.5em;
}

#sustainability .lineup {
  width: 85.06667%;  
  display: flex;
  flex-wrap: wrap-reverse;
  justify-content:space-between;
  margin: 2.4% auto 0;
  padding: 0 0 4.8%;
}

#sustainability .lineup li {
  display: block;
  position: relative;
  width: 30%;
  margin: 0 0 4.8%;
  padding: 0;
  align-items: center;
  
}

#sustainability .pinkribbon_year{
  margin-top: 0.5em;
}
#sustainability .pinkribbon_year img{
  width: 60%;
  margin: 0 auto;
}
#sustainability .animal_box{
  width: 100%;
  background-color: #f1ecd9;
  margin: 4.8% auto 0;
  padding-top: 4.8%;
}
#sustainability .animal_box .introduction{
  padding-bottom: 4.8%;
  justify-content: space-between;
}
#sustainability .animal_img_left{
  margin: 7.2% auto;
  width: 30%;
}
#sustainability .animal_img_left img{
  width: 100%;
}
#sustainability .animal_txt{
  width: 100%;
  text-align: justify;
  font-size: 3.73333vw;
}
#sustainability .animal_img_right{
  width: 30%;
  margin: 4.8% auto; 
  align-items: center;
}


/*---------- story ---------*/
#story {
  position: relative;
  margin: 0 auto;
  width: 100%;
  background-color: #d3c1d4;
  background-image: 
  url("../images/story_bg_01.png"),
  url("../images/story_bg_02.png"),
  url("../images/story_bg_03.png");
  background-position: 4% 4%, 98% 6%, 9% 99%;
  background-size: 32%, 20% , 26%;
  background-repeat: no-repeat; 
}

#story .inner_box {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
}

#story .story_title_01 {
  width: 80%;
  max-width: 631px;
  margin: 0% auto 0% auto;
  padding: 18.66667% 0% 0% 0%;
  box-sizing: border-box;
}

#story .story_title_02 {
  display: inline-block;
  font-size: 4.26667vw;
  color: #956114;
  letter-spacing: 0.04em;
  margin: 5.86667% auto 0% auto;
  padding: 0% 0% 2.13333% 0%;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  box-sizing: border-box;
}

#story .inner {
  position: relative;
  padding: 12.53333% 0% 18.66667% 0%;
  width: 92%;
  max-width: 690px;
  margin: 0 auto;
  box-sizing: border-box;
}

#story .story_box {
  width: 100%;
  max-width: 690px;
  margin: 0 auto;
  padding: 11.449% 0 10.14%;
  border: 1px solid #956114;
  background: #fff;
  box-sizing: border-box;
}

#story .story_box_plane {
  width: 42.46377%;
  max-width: 293px;
  position: absolute;
  top: 0;
  right: 0;
  margin: 1.01449% -2.02899% 0% 0%;
  box-sizing: border-box;
}

#story .story_box_img01,
#story .story_box_img03 {
  width: 95.65217%;
  max-width: 660px;
  margin: 0% 0% 0% -4.34783%;
  box-sizing: border-box;
}

#story .story_box_img02 {
  width: 95.65217%;
  max-width: 660px;
  margin: 15.7971% 0% 0% 8.69565%;
  box-sizing: border-box;
}

#story .story_box_img03 {
  margin: 15.94203% 0% 0% -4.34783%;
}

#story .story_box_title.fst {
  margin: 13.04348% 8.69565% 0% 8.69565%;
}

#story .story_box_title {
  margin: 15.94203% 8.69565% 0% 8.69565%;
  padding: 0;
  color: #956114;
  font-weight: 500;
  font-size: 7.2vw;
  line-height: 1.482;
  letter-spacing: 0.08em;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  box-sizing: border-box;
}

#story .story_box_text {
  line-height: 1.933;
  margin: 5.8% 8.4% 0% 8.4%;
  padding: 0;
  box-sizing: border-box;
  font-size: 4vw;
}

#story .story_box_line01,
#story .story_box_line02 {
  width: 95.65217%;
  max-width: 660px;
  margin: 11.88406% 0% 0% -4.34783%;
  border-top: 1px solid #956114;
  box-sizing: border-box;
}

#story .story_box_line02 {
  margin: 11.88406% 0% 0% 8.69565%;
  box-sizing: border-box;
}

/*---------- momidama ---------*/

#momidama {
  position: relative;
  margin: 0 auto;
  padding: 0 0 12%;
  width: 100%;
  max-width: 767px;
  background-image: linear-gradient(179deg, rgba(241, 236, 217, 1), rgba(194, 207, 187, 1));
  line-height: 1.944;
  font-size: 4vw;
}

#momidama .bg{
  width: 100%;
  margin: 0 auto;
  background-image:
  /* left */
  url("../images/kirakira-A-L-br.png"),
  url("../images/kirakira-A-L-br.png"),
  url("../images/kirakira-C-br.png"),
  /* right */
  url("../images/kirakira-C-br.png"),
  url("../images/kirakira-A-set-br.png"),
  url("../images/kirakira-A-L-br.png")
  ;
  background-position: 
 /* left */
 7% 0.5%, 2% 36%, 1% 100%,
 /* right */
 95% 5%, 95% 24%, 99% 88%;
  background-size: 
  /* left */
  8%, 5%, 4%, 
  /* right */
  7%, 5%, 4%;
  background-repeat: no-repeat;  
}


#momidama .inner_box {
  width: 100%;
  margin: 0 auto;
  padding: 0;
  text-align: center;
}

#momidama .momidama_title_01 {
  width: 80%;
  max-width: 643px;
  margin: 0 auto;
  padding: 13.33333% 0% 0% 0%;
  box-sizing: border-box;
}

#momidama .momidama_title_02{
  display: inline-block;
  font-size: 4.26667vw;
  color: #956114;
  letter-spacing: -0.06em;
  margin: 4.8% auto 0% auto;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  text-align: center;
}
#momidama .momidama_title_img{
    width: 92%;
    max-width: 690px;
    margin: 7.2% auto 0%;
}

#momidama .momidama_title_img img{
  width: 100%
}

#momidama .introduction{
  width: 100%;
  display: flex;
  flex-direction: column;
  margin: 7.2% auto 9.6%;
  text-align: center;
}

#momidama .introduction_img{
  width: 90%;
  max-width: 631px;
  margin: 0 auto 8.4%;
  order: 2;
}

#momidama .introduction_img img{
  width: 100%;
}

#momidama .introduction_txt{
  width: 90%;
  max-width: 631px;
  text-align: justify;
  margin: 0 auto 8.4%;
  order: 1;
}

#momidama .introduction_txt .sub_title{  
  font-size: 7.2vw;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  line-height: 1.5;
  color: #956114;
  margin: 0;
}

#momidama .introduction .staff{
  display: flex;
  align-items: center;
  margin-top: 4.8%;
}
#momidama .introduction .staff img{
  margin-right: 4.8%;
  width: auto;
}


#momidama .content_box {
 background-color: #fff;
 width: 90%;
 margin:0 auto 4.8% ;
 padding: 10%;
 text-align: center;
}

#momidama .content_box .img{
  width: 80%;
  margin: 0 auto 4.8%;
}

#momidama .content_box .img p{
  margin: 0 auto 0;
}
#momidama .content_box .img img{
  width: 100%;
}

#momidama .content_box .text{
  text-align: justify;
  width: 100%;
  max-width: 631px;
}
#momidama .content_box .text p{
  margin-bottom: 10px;
}

#momidama .content_box .sub_title{
  font-size: 7.2vw;
  font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", HGS明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  line-height: 1.5;
  color: #956114;
  margin: 8.4% auto 4.2%;
  text-align: justify;
}

#momidama .content_box .bold_text {
  font-weight: 600;
  color: #956114;
}

/*---------- brand_site ---------*/
#brand_site {
  margin: 0 auto;
  width: 100%;
  background: #fff;
}

#brand_site .inner {
  margin: 0 auto;
  padding: 21.33333% 0% 21.33333% 0%;
  width: 100%;
  max-width: 750px;
  box-sizing: border-box;
}

#brand_site .brand_btn {
  margin: 0% auto 0% auto;
  width: 88%;
  background: #fff;
  box-sizing: border-box;
  position: relative;
  text-align: center;
  position: relative;
}

#brand_site .brand_btn a {
  width: 100%;
  display: inline-block;
  font-size: 4.53333vw;
  padding: 4.13333% 0% 4.13333% 0%;
  margin: 0% auto 0% auto;
  border: 2px solid #bf900b;
  line-height: 1;
  text-align: center;
  color: #bf900b;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  box-sizing: border-box;
  background: #fff;
}

#brand_site .brand_btn:after {
  display: block;
  content: '';
  position: absolute;
  right: 3.067vw;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 3.33%;
  height: 40%;
  background-image: url(../images/arrow.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}

#brand_site .footer_sns ul {
  margin: 18.66667% auto 0;
  padding: 0;
  text-align: center;
}

#brand_site .footer_sns li {
  display: inline-block;
  font-size: 0;
  width: 10.4%;
  max-width: 78px;
}

#brand_site .footer_sns li .x_ikon img{
  width: 85%;
}

#brand_site .footer_sns li img {
  width: 100%;
}


#brand_site .footer_sns li + li {
  margin: 0 0 0 10%;
}

/*---------- lineup ---------*/
#lineup.content_box {
  width: 100%;
  background: #fff;
  margin: 0 auto;
  padding: 0;
  position: relative;
}

#lineup .inner_box {
  width: 100%;
  max-width: 750px;
  margin: 0 auto;
  text-align: left;
}

#lineup .lineup_title_01 {
  width: 71.6%;
  max-width: 555px;
  margin: 18.66666% auto 0;
  text-align: center;
}

#lineup .title_area {
  text-align: center;
}

#lineup .lineup_title_02 {
  display: inline-block;
  font-size: 4.26667vw;
  color: #956114;
  letter-spacing: -0.06em;
  margin: 4.8% auto 0% auto;
  padding: 0% 0% 2.13333% 0%;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  text-align: center;
}

#lineup .lineup_att_text {
  margin: 2.93333% auto 0% auto;
  font-size: 2.66667vw;
  color: #572c17;
  letter-spacing: 0;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  text-align: center;
}

#lineup .introduction {
  width: 92%;
  max-width: 690px;
  margin: 7.46667% auto 0% auto;
}

#lineup .lineup_subtitle_01 {
  width: 92%;
  max-width: 690px;
  margin: 15.73333% auto 0% auto;
}

#lineup .lineup_subtitle_02 {
  width: 92%;
  max-width: 690px;
  margin: 18.13333% auto 0% auto;
}

#lineup .lineup_subtext_01 {
  display: block;
  font-size: 3.46667vw;
  color: #bf900b;
  letter-spacing: 0.2em;
  margin: 3.73333% auto 0% auto;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  text-align: center;
}

#lineup ol.lineup {
  width: 85.06667%;
  max-width: 638px;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  margin: 7.24% auto 0;
  padding: 0 0 0;
}

#lineup ol.lineup li {
  display: block;
  position: relative;
  width: 44.51%;
  max-width: 284px;
  margin: 0;
  padding: 0;
}

#lineup ol.lineup li:nth-child(n+3) {
  margin-top: 9.85%;
}

#lineup ol.lineup li.lastbox {
  margin-left: 28.59%;
}

#lineup ol.lineup li a {
  display: block;
}

#lineup ol.lineup li .lineup_img {
  width: 100%;
  margin: 0%;
}

#lineup ol.lineup li .txt {
  margin: 8.09% 0 0;
  font-size: 3.2vw;
  color: #572c17;
  line-height: 1.5;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
}

#lineup ol.lineup li .txt .att {
  font-size: 2.66667vw;
  border: 1px solid #572c17;
  border-radius: 2px;
  line-height: 1.48%;
  padding: 1.71% 2.11%;
}

#lineup ol.lineup li .comment_box {
  display: flex;
  align-items: center;
  margin: 7.2% 0 0;
  padding: 0 0 0 6.33%;
  height: auto;
  border-left: 3px solid #ddc582;
}

#lineup ol.lineup li .comment {
  font-size: 4vw;
  color: #572c17;
  line-height: 1.3;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 700;
}

/*---------- link ---------*/
#message,
#history,
#sustainability,
#story,
#momidama,
#lineup.content_box {
  padding-top: 55px;
}

#history .inner_box,
#sustainability .inner_box,
#story .inner_box,
#momidama .inner_box,
#lineup .inner_box {
  margin-top: -55px;
}

/*---------- section_wall ---------*/
@media screen and (min-width: 768px) {
  /*---------- link ---------*/
  #message,
  #history,
  #sustainability,
  #story,
  #momidama,
  #lineup.content_box {
    padding-top: 0;
  }
  #history .inner_box,
  #sustainability .inner_box,
  #story .inner_box,
  #momidama .inner_box,
  #lineup .inner_box {
    margin-top: 0;
  }
  
  /*---------- message ---------*/
  #message {
    width: 100%;  
    background-image:
    radial-gradient(at 22% 25%, hsla(16,63%,88%,0.1) 0px, transparent 20%),
    radial-gradient(at 74% 8%, hsla(16,63%,88%,1) 0px, transparent 50%),
    radial-gradient(at 27% 60%, hsla(21,77%,70%,0.5) 0px, transparent 50%),
    radial-gradient(at 77% 88%, hsla(304,40%,80%,0.5) 0px, transparent 50%);
  }
  #message .inner {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
    padding: 0% 0% 11.83333% 0%;
    background-image: 
    /* left */
    url("../images/kirakira-C.png"), 
    url("../images/kirakira-A-S.png"), 
    url("../images/kirakira-A-L.png"), 
    /* right */
    url("../images/kirakira-A-M.png"), 
    url("../images/kirakira-C.png"), 
    url("../images/kirakira-A-S.png");
    background-position: 20% 8%, 1% 35%, 8% 73%, 80% 15%, 90% 60%, 97% 93%;
    background-repeat: no-repeat;
    background-size: 3.5%,2.5%,4.5%,3%,3%,3%;
  }

  #message .message_15thlogo{
    margin: 0 auto;
    padding: 9.66667% 0% 0% 0%;
    width: 86.13333%;
    text-align: center;
  }

  #message .message_15thlogo img{
      width: 160px;
      height: auto;
    }
  #message .message_title {
    position: relative;
    margin: 0% auto 0% auto;
    padding: 4.8% 0% 0% 0%;
    width: 50%;
    max-width: 680px;
    box-sizing: border-box;
    text-align: center;
  }
  #message .message_text,
  #message .message_text_b {
    position: relative;
    margin: 4.66667% auto 0% auto;
    width: 100%;
    max-width: 100%;
    font-size: 2vw;
    line-height: 1.85;
    letter-spacing: 0.1em;
    text-align: center;
  }
  #message .message_text_m0,
  #message .message_text_b_m0 {
    position: relative;
    margin: 0% auto 0% auto;
    width: 100%;
    max-width: 100%;
    font-size: 2vw;
    line-height: 1.85;
    letter-spacing: 0.1em;
    text-align: center;
  }
  #message .message_text_b,
  #message .message_text_b_m0 {
    font-size: 3vw;
  }
  #message .message_text_02 {
    position: relative;
    margin: 4.41667% auto 0% auto;
    width: 28.58333%;
    max-width: 343px;
  }
  #message .message_logo {
    position: relative;
    margin: 7.83333% auto 0% auto;
    width: 6.83333%;
    max-width: 82px;
  }
  #message .message_img_left_01 {
    position: absolute;
    top: 0;
    left: 0;
    margin: 25% 0% 0% 5%;
    width: 15.08333%;
    max-width: 181px;
  }
  #message .message_img_left_02 {
    position: absolute;
    top: 0;
    left: 0;
    margin: 52% 0% 0% 1.66667%;
    width: 17.33333%;
    max-width: 208px;
  }
  #message .message_img_left_03 {
    position: absolute;
    top: 0;
    left: 0;
    margin: 85% 0% 0% 8%;
    width: 27%;
    max-width: 300px;
  }
  #message .message_img_right_01 {
    position: absolute;
    top: 0;
    right: 0;
    margin: 38.58333% 9% 0% 79.58333%;
    width: 15.91667%;
    max-width: 191px;
  }
  #message .message_img_right_02 {
    position: absolute;
    top: 0;
    right: 0;
    margin: 69.41667% 8.83333% 0% 0%;
    width: 30%;
    max-width: 180px;
  }
  #message .message_img_right_03 {
    position: absolute;
    top: 0;
    right: 0;
    margin: 90% 7.16667% -9.58333% 0%;
    width: 21.41667%;
    max-width: 257px;
    z-index: 2;
  }
  /*---------- s01 ---------*/
  #s01 {
    width: 100%;
  }
  #s01 .inner {
    position: relative;
    margin: 0 auto;
    padding: 0;
    width: 100%;
    max-width: 100%;
  }
  #s01 .s01_box01_text,
  #s01 .s01_box02_text,
  #s01 .s01_box03_text {
    margin: 0;
    padding: 0;
    position: absolute;
    top: 50%;
    right: calc(100 / 1400 * 100%);
    transform: translateY(-50%);
    font-size: 2vw;
    letter-spacing: 1.866;
    text-align: left;
  }
  #s01 .s01_box02_text {
    right: auto;
    left: calc(101 / 1400 * 100%);
  }
  #s01 .s01_box03_text {
    right: calc(100 / 1400 * 100%);
  }
  #s01 .s01_box_01,
  #s01 .s01_box_02,
  #s01 .s01_box_03 {
    position: relative;
    margin: 0 auto;
    text-align: center;
  }
  #s01 .s01_box_01 img,
  #s01 .s01_box_02 img,
  #s01 .s01_box_03 img {
    width: 100%;
  }
  /*---------- history ---------*/
  #history {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
  }


  #history .inner{
    margin: 0 auto;
    max-width: 1400px;
    background-image: 
    /* left */
    url("../images/kirakira-A-L.png"), 
    url("../images/bg_img_turip_02.png"), 
    url("../images/kirakira-C.png"), 
    url("../images/kirakira-A-L.png"), 
    url("../images/kirakira-C.png"), 
    url("../images/kirakira-A-L.png"), 
    url("../images/bg_img_turip_04.png"), 
    url("../images/kirakira-A-L.png"), 
    url("../images/bg_img_turip_05.png"), 
    url("../images/kirakira-A-L.png"),
    /* right */
    url("../images/bg_img_turip_01.png"), 
    url("../images/kirakira-C.png"), 
    url("../images/kirakira-A-L.png"), 
    url("../images/kirakira-A-L.png"), 
    url("../images/bg_img_turip_03.png"), 
    url("../images/kirakira-A-L.png"), 
    url("../images/kirakira-C.png"), 
    url("../images/kirakira-A-L.png"), 
    url("../images/kirakira-A-L.png"), 
    url("../images/kirakira-A-L.png"), 
    url("../images/kirakira-C.png")
    ;
    background-position:
    /* left */
    13% 3%, 
    0% 10%, 
    8% 18%, 
    10% 30%, 
    2% 46%, 
    12% 56%,
    3% 63%,
    8% 73%,
    0% 85%,
    7% 95%,
    /* right */
    95% 3%,
    88% 8%,
    93% 13%,
    89% 23%,
    95% 36%,
    100% 42%,
    95% 53%,
    88% 63%,
    95% 77%,
    100% 90%,
    90% 93%
    ;
    background-repeat: no-repeat;
    background-size:
    /* left */ 
    3.5%,8%,2.5%,3%,2.5%,2%,13%,4%,9%,3%,
    /* right */
    10%,
    3%,
    2.8%,
    4%,
    6%,
    2.5%,
    2.8%,
    3%,
    2%,
    2.8%,
    2%
    ;
  }

  #history .inner_box {
    width: 100%;
    max-width: 1200px;
  }
  #history .history_title_01 {
    width: 49.58333%;
    max-width: 595px;
    margin: 0% auto 0% auto;
    padding: 13.33333% 0% 0% 0%;
    box-sizing: border-box;
  }
  #history .history_title_02 {
    display: inline-block;
    font-size: 2.333vw;
    color: #956114;
    letter-spacing: 0.04em;
    margin: 5.86667% auto 0% auto;
    padding: 0% 0% 1.33333% 0%;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight: 500;
  }
  #history .history_column {
    position: relative;
    margin: 0 auto;
    padding: 5.83333% 0% 11.66667% 0%;
    width: 100%;
    max-width: 1200px;
  }
  #history .history_airplane {
    position: absolute;
    top: 0;
    right: 0;
    width: 28.16667%;
    max-width: 338px;
    margin: 0% 3.5% 0% 0%;
  }
  #history .timeline {
    list-style: none;
    margin: 0% auto 0% auto;
    padding: 0;
    width: 83.33%;
    max-width: 1000px;
  }
  #history .timeline > li {
    overflow: hidden;
    margin: 0;
    position: relative;
    background-image: url("../images/history_line.png");
    background-repeat: no-repeat;
    background-position: 20.5% -2%;
    background-size: 0.5% auto;
  }
  #history .timeline > li.y2011 { 
    padding: 0% 0% 2.2% 0%;
  }
  #history .timeline > li.y2012 {
    padding: 0% 0% 0% 0%;
    margin: 0% 0% 0.6% 0%;
  }
  #history .timeline > li.y2013 {
    padding: 0% 0% 2.2% 0%;
  }
  #history .timeline > li.y2014 {
    padding: 0% 0% 3.8% 0%;
  }
  #history .timeline > li.y2015 {
    padding: 0% 0% 3.2% 0%;
  }
  #history .timeline > li.y2016 {
    padding: 0% 0% 4.2% 0%;
  }
  #history .timeline > li.y2018 {
    padding: 0% 0% 2.6% 0%;
  }
  #history .timeline > li.y2019 {
    padding: 0% 0% 6% 0%;
  }
  #history .timeline > li.y2020 {
    padding: 0% 0% 6% 0%;
  }
  #history .timeline > li.y2021 {
    padding: 0% 0% 6% 0%;
  }
  #history .timeline > li.y2022 {
    padding: 0% 0% 6% 0%;
  }
  #history .timeline > li.y2023 {
    padding: 0% 0% 6% 0%;
  }
  #history .timeline > li.y2024 {
    padding: 0% 0% 6% 0%;
  }
  #history .timeline li:first-child {
    padding: 0% 0% 3% 0%;
  }
  #history .timeline li:last-child {
    background-image: none;
  }
  #history .history_product {
    width: 18%;
    float: left;
    margin: 0% 0% 0% 11.2%;
    padding: 0.8% 0% 0.8% 0%;
  }
  #history .history_product.fst {
    padding: 0% 0% 0.6% 0%;
  }
  #history .timeline_content {
    width: 65.5%;
    float: right;
    margin: 0% 0% 0% 0%;
    position: relative;
  }
  #history .timeline_year {
    width: 17.55725%;
    margin: 0;
    padding: 0;
  }
  #history .timeline_year.y2009 {
    margin: 5.49618% 0% 0% 0%;
  }
  #history .timeline_year.y2010 {
    margin: 7.93893% 0% 0% 0%;
  }
  #history .y2011 .timeline_year,
  #history .y2012 .timeline_year {
    margin: 4.58015% 0% 0% 0%;
  }
  #history .y2013 .timeline_year {
    margin: 2.44275% 0% 0% 0%;
  }
  #history .y2014 .timeline_year {
    margin: 5.19084% 0% 0% 0%;
  }
  #history .y2015 .timeline_year {
    margin: 2.1374% 0% 0% 0%;
  }
  #history .y2016 .timeline_year {
    margin: 1.67939% 0% 0% 0%;
  }
  #history .y2018 .timeline_year {
    margin: 1.98473% 0% 0% 0%;
  }
  #history .y2019 .timeline_year {
    margin: 4.8855% 0% 0% 0%;
  }
  #history .timeline_year + .history_text {
    margin: 1.83206% 0% 0% 0%;
  }
  #history .history_text {
    font-size: 1.833vw;
    line-height: 1.45;
    margin: 2.1374% 0% 0% 0%;
    letter-spacing: 0;
  }
  #history .history_text + .history_text {
    margin: 5.49618% 0% 0% 0%;
  }
  #history .pickup {
    color: #956114;
    margin: 3.35878% 0% 3.35878% 4.58015%;
    padding: 0;
    white-space: pre-wrap;
  }
  #history .balloon {
    position: relative;
    display: block;
    margin: 3.66412% 0% 0% -4.58015%;
    max-width: 80%;
    border: solid 2px #956114;
    border-radius: 10px;
    box-sizing: border-box;
  }
  #history .balloon.miniballoon {
    max-width: 80%;
  }
  #history .balloon:before {
    content: "";
    position: absolute;
    left: -24px;
    top: 50%;
    margin-top: -15px;
    border: 12px solid transparent;
    z-index: 2;
  }
  #history .bln2010:before{
  border-top: 13px solid #E8B9C2;
  border-right: 13px solid #E8B9C2;
  }
  #history .bln2011:before{
    border-top: 13px solid #E7B9C2;
    border-right: 13px solid #E7B9C2;
  }
  #history .bln2014:before{
    border-top: 13px solid #EABDBD;
    border-right: 13px solid #EABDBD;
  }
  #history .bln2019:before{
    border-top: 13px solid #ECBFBD;
    border-right: 13px solid #ECBFBD;
  }
  #history .bln2023:before{
    border-top: 13px solid #EFC8C2;
    border-right: 13px solid #EFC8C2;
  }
      
  
  #history .balloon:after {
    content: "";
    position: absolute;
    left: -30px;
    top: 50%;
    margin-top: -17px;
    border: 14px solid transparent;
    border-top: 13px solid #956114;
    border-right: 14px solid #956114;
    z-index: 1;
  }
  #history .history_item_10 {
    position: absolute;
    top: 0;
    right: 0;
    width: 16.94656%;
    margin: 27.93893% 24.42748% 0% 0%;
  }
  #history .history_item_11 {
    position: absolute;
    top: 0;
    right: 0;
    width: 14.35115%;
    margin: 43.20611% 15.41985% 0% 0%;
  }
  #history .history_item_12 {
    position: absolute;
    top: 0;
    right: 0;
    width: 14.65649%;
    margin: 28.0916% 24.12214% 0% 0%;
  }
  #history .history_item_13 {
    position: absolute;
    top: 0;
    right: 0;
    width: 14.80916%;
    margin: 47.32824% 10.99237% 0% 0%;
  }
  #history .history_item_14 {
    position: absolute;
    top: 0;
    right: 0;
    width: 14.0458%;
    margin: 27.48092% 18.62595% 0% 0%;
  }
	
#history .history_item_2015_01 {
  position: absolute;
  top: 0;
  right: 0;
    width: 14.0458%;
    margin: 27.48092% 9.62595% 0% 0%;
}
	
  #history .history_item_15 {
    position: absolute;
    top: 0;
    right: 0;
    width: 15.1145%;
    margin: 28.54962% 12.9771% 0% 0%;
  }
  #history .history_item_16 {
    position: absolute;
    top: 0;
    right: 0;
    width: 16.79389%;
    margin: 49.77099% 12.21374% 0% 0%;
  }
  #history .history_item_17 {
    position: absolute;
    top: 0;
    right: 0;
    width: 17.18%;
    margin: 65% 5% 0 0;
  }
  #history .history_item_18 {
    position: absolute;
    top: 0;
    right: 0;
    width: 18%;
    margin: 94% 20% 0 0;
  }

  #history .history_item_19 {
    position: absolute;
    top: 0;
    right: 0;
    width: 16%;
    margin: 22% 0% 0 0;
  }

  #history .history_item_20 {
    position: absolute;
    top: 0;
    right: 0;
    width:20%;
    margin: 48% 15% 0 0;
  }

  #history .history_item_21 {
    position: absolute;
    top: 0;
    right: 0;
    width: 18%;
    margin: 35% 0% 0 0;
  }


  #history .history_item_22 {
    position: absolute;
    top: 0;
    right: 0;
    width: 17%;
    margin: 15% 10% 0 0;
  }

  #history .history_special_wall {
    width: 64%;
    max-width: 768px;
    margin: 0 auto;
    box-sizing: border-box;
    border: 3px solid #956114;
    border-radius: 10px;
    position: relative;
    margin: 5% auto 0% auto;
  }

  #history .history_special {
    display: flex;
    align-items: center;
    border: 1px solid #956114;
    border-radius: 4px;
    margin: 0.65%;
    padding: 3.2% 3.2%;
    box-sizing: border-box;
  }
  #history .history_special_text.sp {
    display: none;
  }
  #history .history_special_date,
  #history .history_special_text {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0;
    color: #956114;
    font-size:2.4vw;
    line-height: 1.5;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
  }
  #history .history_special_text {
    margin: 0 0 0 2.86%;
    padding: 0 0 0 3.38%;
    border-left: 3px solid #956114;
    box-sizing: border-box;
  }
  #history .history_special_text a:hover {
    opacity: .7;
  }
  #history .history_special_box {
    margin: 0 0 0 2.86%;
    padding: 0 0 0 3.38%;
    width: 83.82%;
    max-width: 600px;
    border-left: 3px solid #956114;
    box-sizing: border-box;
    display: flex;
    align-items: center;
  }
  #history .history_special_box_left{
    float: left;
  }
  #history .history_special_box .history_special_text {
    border-left:none;
    margin: 0;
    padding: 0;
  }
  #history .history_special_box_right{
    float: right;
    margin-left:2.4% ;
  }
  #history .history_special_box_right img{
    min-width:100px;
  }

  #history .gooddesign {
    display: flex;
    margin: 2.5% 0 2.5% 4.5%;
  }
  #history .gooddesign_logo {
    width: 17.66667%;
    max-width: 106px;
    align-self: center;
    margin: 0;
    padding: 0;
  }
  #history .gooddesign_text {
    align-self: center;
    margin: 0 0 0 3.33333%;
    padding: 0;
    color: #956114;
    font-size: 2.4vw;
    line-height: 1.5;
    font-family: "游ゴシック体", "YuGothic", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
  }

 /*---------- sustainability ---------*/
 #sustainability {
  position: relative;
  margin: 0 auto;
  padding: 0 0 12%;
  width: 100%;
  max-width: 100%;
  background-image: linear-gradient(179deg, rgba(255, 239, 217, 1), rgba(225, 225, 239, 1));
}

#sustainability .inner_box {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
  color: #956114;
}

#sustainability .sustainability_title_01 {
  width: 80%;
  max-width: 494px;
  margin: 0 auto;
  padding: 13.33333% 0% 0% 0%;
  box-sizing: border-box;
}

#sustainability .sustainability_title_02 {
  font-size: 2.4vw;
  letter-spacing: -0.06em;
  margin: 4.8% auto 0% auto;
  padding: 0% 0% 2.13333% 0%;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  text-align: center;
}


#sustainability .sustainability_title_03 {
  font-size: 2.4vw;
  letter-spacing: -0.06em;
  margin: 4.8% auto 7.2% auto;
  padding: 0% 0% 2.13333% 0%;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  font-weight: 500;
  text-align: center;
}

#sustainability .inner_1200{
  line-height: 1.944;
  font-size: 1em;
  width: 90%;
  margin: 0 auto;
}

#sustainability .pinkribbon_box{
  background-color: #fdedec;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding-top: 0;
}

#sustainability .introduction{
  width: 85.06667%;
  max-width: 1000px; 
  display: flex;  
  margin: 0% auto;
}
#sustainability .pinkribbon_img {
  float: left;
  margin: 7.2% 10% 0% 0%;
  width: 35%;
}
#sustainability .pinkribbon_img img{
  width: 100%;
  padding: 0 18%;
}
#sustainability .pinkribbon_txt{
  font-size: 1.8vw;
  text-align: justify;
  padding-top:  4.8%;
}
#sustainability .sub_title{
  font-size: 2.4vw;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  line-height: 1;
  margin-bottom: 0.5em;
}

#sustainability .lineup {
  width: 85.06667%;
  max-width: 1000px;  
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  margin: 2.4% auto 0;
  padding: 0 0 4.8%;
}

#sustainability .lineup li {
  display: block;
  position: relative;
  width: 13%;
  max-width: 150px;
  margin: 0;
  padding: 0;
  align-items: center;
}
#sustainability .pinkribbon_year{
  margin-top: 0.5em;
}
#sustainability .animal_box{
  width: 100%;
  max-width: 1200px;
  background-color: #f1ecd9;
  margin: 4.8% auto 0;
  padding-top: 4.8%;
}
#sustainability .animal_box .introduction{
  padding-bottom: 4.8%;
  justify-content: space-between;
}
#sustainability .animal_img_left{
  float: left;
  margin: 0 10% 0% 0%;
  width: 15%;
}
#sustainability .animal_img_left img{
  width: 100%;
  padding: 0 18%;
}
#sustainability .animal_txt{
  font-size: 1.8vw;
  width: 55%;
  margin-right: 4%;
  text-align: justify;
}
#sustainability .animal_img_right{
  width: 16%;
  margin-top: 4.8%; 
  align-items: center;
}
  /*---------- story ---------*/
  #story {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    padding: 0 0 12%;
    overflow: hidden;
    background-color: #d3c1d4;
    background-image: 
    url("../images/story_bg_01.png"),
    url("../images/story_bg_02.png"),
    url("../images/story_bg_03.png")
    ;
    background-position: 7% 10.5%, 92% 13%, 15% 96%;
    background-size: 19%, 14% , 11%;
    background-repeat: no-repeat;  

  }
  #story .inner_box {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;  

  }
  #story .story_title_01 {
    width: 48.75%;
    max-width: 585px;
    margin: 0% auto 0% auto;
    padding: 13.16667% 0% 0% 0%;
  }
  #story .story_title_02 {
    display: inline-block;
    font-size: 2.4vw;
    color: #956114;
    letter-spacing: 0.18em;
    margin: 3.66667% auto 0% auto;
    padding: 0% 0% 1.33333% 0%;
    font-weight: 500;
  }
  #story .inner {
    position: relative;
    padding: 0;
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
  }
  #story .inner_1200 {
    width: 85.71%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0;
    position: relative;
  }
  #story .story_box {
    width: 100%;
    max-width: 1200px;
    margin: 7.2% 0% 0%;
    padding: 9% 8.33333% 8.83333% 8.33333%;
    border: 1px solid #956114;
    position: relative;
    box-sizing: border-box;
  }
  #story .story_box_plane {
    width: 28.08333%;
    max-width: 337px;
    position: absolute;
    top: 0;
    left: 0;
    margin: -8.25% 0% 0% 14.66667%;
    box-sizing: border-box;
  }
  #story .story_box_img01,
  #story .story_box_img03 {
    float: left;
    width: 65%;
    max-width: 650px;
    margin: 0% 0% 0% -20%;
    box-sizing: border-box;
  }
  #story .story_box_img02 {
    float: right;
    width: 65%;
    max-width: 650px;
    margin: 3.2% -20% 0% 0%;
    box-sizing: border-box;
  }
  #story .story_box_img01 img,
  #story .story_box_img02 img,
  #story .story_box_img03 img{
    width: 100%;
  }
  
  #story .detail {
    float: right;
    width: 45%;
    max-width: 450px;
  }
  #story .detail.s02 {
    float: left;
  }
  #story .story_box_title {
    margin: 0% 0% 0% 0%;
    padding: 0;
    color: #956114;
    font-weight: 500;
    font-size: 3.5vw;
    line-height: 1.48;
    letter-spacing: 0.08em;
    font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  }
  #story .story_box_title.fst {
    margin: 0% 0% 0% 0%;
    letter-spacing: 0em;
  }
  #story .story_box_title.lst {
    margin: -26% 0% 0% 0%;
  }
  #story .story_box_text {
    line-height: 1.944;
    margin: 3% 0% 0% 0%;
    padding: 0;
    letter-spacing: 0em;
    font-size: 1.8vw;
  }
  #story .story_box_line01,
  #story .story_box_line02 {
    width: 65%;
    max-width: 650px;
    margin: -5.4% 0% 13% -20%;
    border-top: 2px solid #956114;
  }
  #story .story_box_line02 {
    margin: 9% 0% 14% -20%;
  }
/*---------- momidama ---------*/

#momidama {
  position: relative;
  margin: 0 auto;
  padding: 0 0 12%;
  width: 100%;
  max-width: 100%;
  background-image: linear-gradient(179deg, rgba(241, 236, 217, 1), rgba(194, 207, 187, 1));
  line-height: 1.944;
  font-size: 1.8vw;
}

#momidama .bg{
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  background-image:
  /* left */
  url("../images/kirakira-A-L-br.png"),
  url("../images/kirakira-A-L-br.png"),
  url("../images/kirakira-C-br.png"),
  /* right */
  url("../images/kirakira-C-br.png"),
  url("../images/kirakira-A-set-br.png"),
  url("../images/kirakira-A-L-br.png")
  ;
  background-position: 
  /* left */
  5% 23%, 2% 60%, 4% 100%,
  /* right */
  78% 7%, 95% 43%, 99% 88%
  ;
  background-size: 
  /* left */
  3%, 2.5%, 3%, 
  /* right */
  4%,3.5%,3% ;
  background-repeat: no-repeat;  
}

#momidama .inner_box {
  width: 100%;
  margin: 0 auto;
  padding: 0;
  text-align: center;
}

#momidama .momidama_title_01 {
  width: 48%;
  max-width: 693px;
  margin: 0 auto;
  padding: 13.33333% 0% 0% 0%;
  box-sizing: border-box;
}

#momidama .momidama_title_02{
  display: inline-block;
  font-size: 2.4vw;
  color: #956114;
  letter-spacing: -0.06em;
  margin: 4.8% auto 0% auto;
  font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
  font-weight: 500;
  text-align: center;
}

#momidama .momidama_title_img{
  width: 100%;
  max-width: 1000px;
  margin: 7.2% auto 9.6%;
}

#momidama .momidama_title_img img{
  width: 100%;
  
}

#momidama .introduction{
  width: 100%;
  max-width: 1000px;
  text-align: left;
  display: flex;
  flex-direction: row;
  margin: 7.2% auto 9.6%;
}
#momidama .introduction_img{
  width: 40%;
  float: left;
  margin: 0 7.2% 0 0;
  order: 1;
}

#momidama .introduction_txt{
  float: right; 
  width: 52.8%;
  text-align: justify;
  order: 2;
  font-size: 1.8vw;
}

#momidama .introduction_txt .sub_title{  
  font-size: 3.5vw;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  line-height: 1.5;
  color: #956114;
  margin: 0;
}

#momidama .introduction .staff{
  display: flex;
  align-items: center;
}
#momidama .introduction .staff img{
  margin-right: 4.8%;
}

#momidama .content_box {
  width: 100%;
  max-width: 1000px;
  display: flex;;
  background-color: #fff;
  margin:0 auto 4.8% ;
  padding: 4.8% 5%;
  box-sizing:border-box
}

#momidama .content_box .img{
  float: left;
  width: 25.2%;
  margin: 0 4.8% 0 0;
  flex-grow: 1;
}

#momidama .content_box .img p{
  margin: 0 auto 0;
}
#momidama .content_box .img img{
  width: 100%;
}

#momidama .content_box .text{
  text-align: justify;
  width: 60%;
  flex-grow: 2;
}

#momidama .content_box .sub_title{
  font-size: 2.8vw;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,"ＭＳ Ｐ明朝","ＭＳ 明朝", serif;
  line-height: 1.5;
  color: #956114;
  margin: 0;
}

#momidama .content_box .bold_text{
  font-weight: 600;
  color: #956114;
}

  /*---------- brand_site ---------*/
  #brand_site {
    margin: 0 auto;
    width: 100%;
    background: #fff;
  }
  #brand_site .inner {
    margin: 0 auto;
    padding: 8.4% 0 9%;
    width: 100%;
    max-width: 1200px;
    box-sizing: border-box;
  }
  #brand_site .brand_btn {
    margin: 0% auto 0% auto;
    width: 40%;
    max-width: 480px;
  }
  #brand_site .brand_btn a {
    font-size: 2vw;
    padding: 4.58% 0;
  }
  #brand_site .brand_btn a:hover {
    opacity: .7;
  }
  #brand_site .brand_btn:after {
    right: 1.667vw;
    width: 2.91%;
    height: 36.11%;
  }
  #brand_site .brand_btn:hover:after {
    opacity: .7;
  }
  #brand_site .footer_sns ul {
    margin: 11.66667% 0 0% 0;
    padding: 0;
    text-align: center;
  }
  #brand_site .footer_sns li {
    display: inline-block;
    font-size: 0;
    max-width: 48px;
  }
  #brand_site .footer_sns .x_ikon img{
    width: 85%;
  }
  #brand_site .footer_sns li img {
    width: 100%;
  }
  #brand_site .footer_sns li + li {
    margin: 0 0 0 48px;
  }
  .btn_mute,
  .btn_mute.on {
    display: block;
    width: 3.5%;
    height: auto;
    max-width: 42px;
    max-height: 42px;
    position: absolute;
    bottom: 0;
    right: 0;
    margin: 0% 7.83333% 5.66667% 0%;
    z-index: 4;
    cursor: pointer;
  }
  #lineup.content_box {
    width: 100%;
    background: #fff;
    margin: 0 auto;
    padding: 0;
    position: relative;
  }
  #lineup .inner_box {
    width: 100%;
    max-width: 1200px;
    text-align: left;
  }
  #lineup .lineup_title_01 {
    width: 51.91667%;
    max-width: 555px;
    margin: 0% auto 0% auto;
    padding: 11.66667% 0% 0% 0%;
    text-align: center;
  }
  #lineup .lineup_title_02 {
    display: inline-block;
    font-size: 2.33vw;
    color: #956114;
    letter-spacing: 0;
    margin: 3.8% auto 0% auto;
    padding: 0% 0% 1.2% 0%;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight: 500;
  }
  #lineup .lineup_att_text {
    margin: 1.8% auto 0% auto;
    font-size: 1.083vw;
  }
  #lineup .introduction {
    width: 83.333%;
    max-width: 1000px;
    margin: 7.2% auto 9.6%;
  }
  #lineup .introduction img{
    width: 100%;
  }

  #lineup .lineup_subtitle_01 {
    width: 83.33333%;
    max-width: 1000px;
    margin: 11% auto 0% auto;
  }
  #lineup .lineup_subtitle_02 {
    width: 83.33333%;
    max-width: 1000px;
    margin: 8% auto 0% auto;
  }
  #lineup .lineup_subtext_01 {
    display: block;
    font-size: 1.5vw;
    color: #bf900b;
    letter-spacing: 0.2em;
    margin: 2.2% auto 0% auto;
  }
  #lineup ol.lineup {
    width: 83.33333%;
    max-width: 1000px;
    display: flex;
    flex-flow: row wrap;
    margin: 4.8% auto 0;
    padding: 0;
  }
  #lineup ol.lineup.premium {
    padding: 0;
  }
  #lineup ol.lineup li {
    display: block;
    position: relative;
    width: 17.4%;
    max-width: 174px;
    margin: 0;
    padding: 0;
  }
  #lineup ol.lineup li.firstbox {
    margin-left: 10.7%;
  }
  #lineup ol.lineup li:nth-child(n+3) {
    margin-top: 0;
  }
  #lineup ol.lineup li.lastbox {
    margin-left: 0;
  }
  #lineup ol.lineup li.lastbox2 {
    margin-right: 9.9%;
  }
  #lineup ol.lineup li a {
    display: block;
  }
  #lineup ol.lineup li .lineup_img {
    width: 100%;
    margin: 0%;
  }
  #lineup ol.lineup li .txt {
    margin: 8.04% 0 0;
    font-size: 1.25vw;
    /*font-size: 15px;*/
    color: #572c17;
    line-height: 1.46;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight: 500;
    text-align: left;
    letter-spacing: -0.01em;
  }
  #lineup ol.lineup li .txt .att {
    display: inline-block;
    font-size: 1.083vw;
    /*font-size: 13px;*/
    border: 1px solid #572c17;
    border-radius: 2px;
    line-height: 1.46;
    padding: 1.14% 2.81% 0.28%;
    margin: 0 0 2.29%;
  }
  #lineup ol.lineup li .comment_box {
    display: flex;
    align-items: center;
    margin: 5.74% 0 0;
    padding: 0 0 0 5.498%;
    height: 2.7em;
    border-left: 3px solid #ddc582;
  }
  #lineup ol.lineup li .comment {
    font-size: 1.5vw;
    color: #572c17;
    line-height: 1.26;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    font-weight: 700;
    letter-spacing: 0;
  }
}

@media screen and (min-width: 1200px) {
  #lineup .lineup_att_text,
  #lineup ol.lineup li .txt .att {
    font-size: 13px;
  }
  #lineup ol.lineup li .txt {
    font-size: 15px;
  }

  #story {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    padding: 0 0 12%;
    overflow: hidden;
    background-color: #d3c1d4;
    background-image: 
    url("../images/story_bg_01.png"),
    url("../images/story_bg_02.png"),
    url("../images/story_bg_03.png")
    ;
    background-position: 15% 10.5%, 77% 15%, 30% 92%;
    background-size: 10%, 6%, 8%;
    background-repeat: no-repeat;  

  }


  #story .story_box_text,
  #momidama .introduction_txt,
  #momidama .content_box .text  {
    font-size: 16px;  
  }
  .lineup_subtext_01,
  #lineup ol.lineup li .comment {
    font-size: 18px;
  }
  #history .history_text,
  #sustainability .pinkribbon_txt,
  #sustainability .animal_txt{
    font-size: 22px;
  }
  #message .message_text,
  #message .message_text_m0,
  #s02 .s02_box_text{
    font-size: 24px;
  }

  #history .history_special_text {
    font-size: 26px;
  }
  #lineup .lineup_title_02,
  #story .story_title_02,
  #history .history_title_02,
  #sustainability .sustainability_title_02,
  #sustainability .sustainability_title_03,
  #momidama .momidama_title_02,
  #momidama .content_box .sub_title {
    font-size: 28px;
  }
  #message .message_text_b,
  #message .message_text_b_m0 {
    font-size: 30px;
  }
  #history .gooddesign_text,
  #history .history_special_date,
  #sustainability .sub_title,
  #momidama .introduction_txt .sub_title  {
    font-size: 32px;
  }
  #story .story_box_title {
    font-size: 42px;
  }

  #s01 .s01_box01_text,
  #s01 .s01_box02_text,
  #s01 .s01_box03_text {
    font-size: 1.5vw;
  }

  #momidama .inner_box{
    width: 100%;
    max-width: 1200px;
  }

  #s02 .s02_cloud_left_01 {
    margin: 215px 0 0 0;
  }
  #s02 .s02_cloud_left_02 {
    margin: 357px 0 0 0;
  }
  #s02 .s02_cloud_right_01.pc {
    margin: 192px 0 0 0;
  }
  #s02 .s02_cloud_right_02 {
    margin: 558px 0 0 0;
  }
  #brand_site .brand_btn a {
    font-size: 24px;
  }
  #brand_site .brand_btn:after {
    right: 20px;
  }
}