body.collection {
     min-width: 100% !important;
}

strong {
    color: #eda300 !important;
}

.collection #header2{
  height: 50px;/*高さ指定*/
  width:100%;/*横幅指定*/
  /*以下はレイアウトのためのCSS*/
  /*display: flex;*/
  justify-content: space-between;
  align-items: center;
  background:#221815;
  text-align: center;
  padding: 20px;
  display: none;
}

/*JSを使いfixedクラスが付与された際の設定*/
.collection #header2.fixed{
  position: fixed;/*fixedを設定して固定*/
    z-index: 999;/*最前面へ*/
    top:0;/*位置指定*/
    left:0;/*位置指定*/
    display: block;
    box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2); 
    animation-name:fadeInAnime;
    animation-duration:1s;
    animation-fill-mode:forwards;
    opacity:0;
}

.collection #header2.fixed h1{
}
.collection #header2.fixed h1 .img {
    max-width: 160px;
    width: 35%;
    float: left;
}
.collection #header2.fixed h1 span {
    float: left;
    margin-left: 20px;
    max-width: 400px;
    width: 50%;
}
.collection #header2.fixed h1 span img {
    width: 100%;
}

.collection .main_img{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  color:#fff;
  text-shadow: 0 0 15px #666;
	text-align: center;
}


/*========= スクロールをすると下のエリアが上にかぶさるCSS ===============*/

.collection #header_collection{
    /*headerを全画面で見せる*/
	width:100%;
	height: 100vh;
	position: relative;
} 

.collection #header_collection:before{
    /*header の疑似要素に背景画像を指定*/
	/* content:"";
	position:fixed;
	top:0;
	left:0;
	z-index:-1;
	width:100%;
	height: 100vh; */
	/*背景画像設定*/
	/* background:url("../../../assets/images/photos/collection/main.jpg") no-repeat center;
	background-size:cover; */
}
.collection #header_collection .kvvideo{
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100vh;
}
.collection #header_collection .kvvideo video{
    object-fit: cover;
    width: 100%;
    height: 100%;
}


/*下の被さるエリアの指定*/
.collection #container_collection{
	position: relative;
	z-index:1;
    /*以下はレイアウトのための記述*/
	background:#fff !important;
	padding:3% 0 0;
	text-align: center;
}

ul.pankuzu {
    padding: 1% 1.5% 3%;
    background: #fff;
    display: inline-block;
}
ul.pankuzu li {
    float: left;
    font-size: 85%;
}

ul.pankuzu li:after {
    content: ">";
    margin: 0 10px;
}

ul.pankuzu li:last-child:after {
    content: "";
    margin: 0;
}

.c_pankuzu { text-align: left; margin-left: 20px; padding: 0; letter-spacing: -0.4em; width: 100%; display: block; top:20px !important;}
.c_pankuzu li { letter-spacing: 0px; display: inline; line-height: 1em; font-size: 1.2rem; }
.c_pankuzu li a { color: #e60012; display: inline; }
.c_pankuzu li + li { position: relative; padding-left: 20px; background: url(/assets/images/common/icon/pc/arrow4.svg) no-repeat 9px center; }

.collection #container_collection h1 {
    max-width: 425px;
    width: 50%;
    margin: 3% auto 3%;
}

.collection #container_collection h1 img {
    width: 100%;
}

.collection #container_collection p.txt1 {
    font-size: 2.1rem !important;
}

.collection #container_collection p {
    font-size: 18px !important;
    font-size: 1.285714286rem !important;
}

.our_comitment {
    background: #f5ede0;
    width: 100%;
    color: #221815;
}
.our_comitment .inner {
    width: 90%;
    max-width: 1900px;
    margin: 0 auto;
    padding: 3%;
    text-align: left;
    display: flex;
    justify-content: space-between;
}

.our_comitment .inner div:nth-of-type(1) {
    width: 38%;
}

.our_comitment .inner div:nth-of-type(2) {
    width: 60%;
}

.our_comitment .inner div div img {width: 100%;}

.our_comitment .inner div:nth-of-type(2) div.item01 {
    margin: 0 0 0 0;
    width: 42%;
    float: left;
}

.our_comitment .inner div:nth-of-type(2) div.item02 {
    margin: 15% 0 0 0;
    width: 55%;
    float: right;
}

.our_comitment .inner div:nth-of-type(2) div.item03 {
    margin: -20% 0 0 12%;
    width: 30%;
    float: left;
    clear: both;
}

.our_comitment .inner div:nth-of-type(2) div.item04 {
    margin: 3% 0 0 20%;
    width: 42%;
    float: left;
    clear: both;
}

.our_comitment .inner div:nth-of-type(2) div.item05 {
    margin: -40% 0 0 12%;
    width: 30%;
    float: right;
}

#body-inside{
overflow: hidden;
}

.photo {
    background: #fff;
    width: 100%;
    /*text-align: left;*/
    display: block;
    clear: both;
}

.shadow {
  box-shadow: 0 1rem 2rem hsl(0 0% 0% / 20%);
  
  background: hsl(0 0% 100%);
  color: hsl(200 50% 20%);
  display: flex;
  place-items: center;
  text-align: center;
  /*border-radius: 5px;*/
 /*padding: 10px;
  border: 1px solid hsl(0 0% 83%);
  box-sizing: border-box;*/
}

/*.shadow1 {
  box-shadow: 0 2.5rem 2rem -2rem hsl(200 50% 20% / 40%);
}*/

.photo .inner1 {
    width: 100%;
    max-width: 1900px;
    margin: 0 auto;
    padding: 3% 0 9%;
    display: block;
    background: #fff;
}

.photo .inner1 div.img01 {
    margin: 0;
    width: 52.63%;
    float: left;
}

.photo .inner1 div.img11 {
    margin: -24% 0 0 0;
    width: 52.63%;
    float: right;
}
.photo .inner1 div.img12 {
    margin: 3% 0 0 0;
    width: 52.63%;
    float: left;
    clear: both;
}

.photo .inner1 div.img02 {
    width: 68.42%;
    float: right;
    margin: -3% 0 0 0;
    
}

.photo .inner1 div.img03 {
    width: 43.68%;
    float: left;
    margin: -24% 0 0 0;
    clear: both;   
}

.photo .inner1 div.img04 {
    width: 43.68%;
    float: left;
    margin: 5% 0 0 16.84%;
    clear: both;   
}

.photo .inner1 div.img05 {
    width: 26.32%;
    float: left;
    margin: 5% 0 0 42.63%;
    clear: both;   
}

.photo .inner1 div.img06 {
    width: 26.32%;
    float: right;
    margin: 5% 0 0 0;  
}

.photo .inner2 {
    width: 100%;
    max-width: 1900px;
    margin: 0 auto;
    display: block;
    z-index: 5;
    position: relative;
}

.photo .inner2 div.img07 {
    width: 43.68%;
    float: left;
    margin: -5% 0 0 9.47%;
    z-index: 20;
    position: relative;
}

.photo .inner2 div.img08 {
    width: 20%;
    float: left;
    margin: -5% 0 0 0%;
    clear: both;
    z-index: 10;
    position: relative;
}

.photo .inner2 div.img09 {
    width: 52.63%;
    float: right;
    margin: -5% 0 -5% 0;
}

.photo .inner1 div.img10 {
    width: 43.68%;
    float: left;
    margin: 5% 0 0 9.47%;
    clear: both;
}

.photo .inner1 div.img13 {
    width: 43.68%;
    float: right;
    margin: -11% 9.47% 0 0;
}

.photo .inner1 div.img14 {
    width: 68.42%;
    float: left;
    margin: 5% 9.47% 0 0;
    clear: both;
}

.photo .inner1 div.img15 {
    width: 43.68%;
    float: right;
    margin: -40% 0% 0 0;
}
.photo .inner1 div.img16 {
    width: 20%;
    float: right;
    margin: 0 0 0 0%;
}

.photo .inner2 div.img17 {
    width: 43.68%;
    float: left;
    margin: -20% 0 0 0%;
    clear: both;
}

.photo .inner2 div.img18 {
    width: 43.68%;
    float: right;
    margin: 5% 5% 0 0;
}

.photo .inner2 div.img19 {
    width: 43.68%;
    float: left;
    margin: -5% 0 0 40%;
    clear: both;
}

.photo .inner2 div.img20 {
    width: 26.32%;
    float: left;
    margin: -20% 0 -5% 10%;
    clear: both;
}

.photo .inner1 div.img21 {
    width: 84%;
    float: left;
    margin: 5% 8% 0;
    clear: both;
}

.photo .inner1 div.img22 {
    width: 43.68%;
    float: left;
    margin: 5% 0 0 8%;
    clear: both;
}

.photo .inner1 div.img23 {
    width: 43.68%;
    float: right;
    margin: -20% 8% 0 0;
}
.photo .inner2 div.img24 {
    width: 43.68%;
    float: left;
    margin: -15% 0 0 15%;
}

.photo .inner2 div.img25 {
    width: 43.68%;
    float: right;
    margin: 5% 0 0 0;
}

.photo .inner2 div.img26 {
    width: 43.68%;
    float: left;
    margin: -32% 0 0 8%;
    clear: both;
}

.photo .inner2 div.img27 {
    width: 43.68%;
    float: left;
    margin: 3% 0 0 40%;
    clear: both;
}

.photo .inner2 div.img28 {
    width: 26.32%;
    float: left;
    margin: -30% 0 0 0%;
    clear: both;
}

.photo .inner2 div.img29 {
    width: 26.32%;
    float: left;
    margin: -20% 0 -5% 2%;
}

.photo .inner1 div.img30 {
    width: 43.68%;
    float: left;
    margin: 5% 0 0 5%;
    clear: both;
}

.photo .inner1 div.img31 {
    width: 26.32%;
    float: right;
    margin: 15% 8% 0 0;
}

.photo .inner1 div.img32 {
    width: 26.32%;
    float: left;
    margin: -5% 0 0 36.8%;
    clear: both;
}

.photo .inner1 div.img33 {
    width: 26.32%;
    float: left;
    margin: -20% 0 0 8%;
    clear: both;
}

.photo .inner1 div.img34 {
    width: 43.68%;
    float: left;
    margin: 5% 0 0 0;
    clear: both;
}

.photo .inner1 div.img35 {
    width: 68.42%;
    float: right;
    margin: -20% 0 0 0%;
}

.bg {
    background: #9DB390 !important;
}
.bg01 {
    background: #ddd !important;
}

.bg02 {
    background: #C8BEA4 !important;
}

.photo .inner2 div.img16 {
    width: 43.68%;
    float: left;
    margin: -5% 0 0 9.47%;
    z-index: 20;
    position: relative;
}

.photo .inner1 div img, .photo .inner2 div img {
    width: 100%;
}

.full {
	background: #d1e5b7;
    margin: 5px calc(50% - 50vw) 15px;
  width: 100vw;
}


.frame-box-001 {
	padding: 30px;
	position: relative;
}

.frame-box-001::before, .frame-box-001::after {
	content: '';
	width: 30px;
	height: 30px;
	position: absolute;
}

.frame-box-001::before {
	border-left: solid 2px #221815;
	border-top: solid 2px #221815;
	top: 0;
	left: 0;
}

.frame-box-001::after {
	border-right: solid 2px #221815;
	border-bottom: solid 2px #221815;
	bottom: 0;
	right: 0;
}

.collection h2 {
    font-size: 28px !important;
    font-size: 2rem !important;
    font-weight: bold;
    display: inline-block;
}


/* fadeIn */

.fadeIn{
animation-name:fadeInAnime;
animation-duration:1s;
animation-fill-mode:forwards;
opacity:0;
}

@keyframes fadeInAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/* フェードイン(初期値) */
.js-fadeUp {
  opacity: 0; /* 最初は非表示 */
  transform: translateY(30px); /* 下に30pxの位置から */
  transition: opacity .8s, transform .8s; /* 透過率と縦方向の移動を0.8秒 */
}
.js-fadeUp2 {
  opacity: 0; /* 最初は非表示 */
  transform: translateY(15px); /* 下に15pxの位置から */
  transition: opacity .8s, transform .8s; /* 透過率と縦方向の移動を0.8秒 */
}
.js-fadeLeft {
  opacity: 0; /* 最初は非表示 */
  transform: translateX(-30px); /* 下に30pxの位置から */
  transition: opacity .8s, transform .8s; /* 透過率と縦方向の移動を0.8秒 */
}
.js-fadeRight {
  opacity: 0; /* 最初は非表示 */
  transform: translateX(30px); /* 下に30pxの位置から */
  transition: opacity .8s, transform .8s; /* 透過率と縦方向の移動を0.8秒 */
}
/* フォントカラー(初期値) */
.js-color {
  color: blue; /* 最初は青色 */
  font-size: 15px; /* 最初は15px */
  transition: color .8s, font-size .8s; /* 色の変化を0.8秒かける */
}
/* フェードイン(スクロールした後) */
.js-fadeUp.is-inview {
  opacity: 1; /* 表示領域に入ったら表示 */
  transform: translateY(0); /* 30px上に移動する */
  transition-delay: .5s; /* フェード開始を0.5秒遅らせる */
}
.js-fadeUp2.is-inview {
  opacity: 1; /* 表示領域に入ったら表示 */
  transform: translateY(0); /* 15px上に移動する */
  transition-delay: .8s; /* フェード開始を0.8秒遅らせる */
}
.js-fadeUp3.is-inview {
  opacity: 1; /* 表示領域に入ったら表示 */
  transform: translateY(0); /* 15px上に移動する */
  transition-delay: .3s; /* フェード開始を0.8秒遅らせる */
}
.js-fadeLeft.is-inview {
  opacity: 1; /* 表示領域に入ったら表示 */
  transform: translateX(0); /* 30px上に移動する */
  transition-delay: .5s; /* フェード開始を0.5秒遅らせる */
}
.js-fadeRight.is-inview {
  opacity: 1; /* 表示領域に入ったら表示 */
  transform: translateX(0); /* 30px上に移動する */
  transition-delay: .5s; /* フェード開始を0.5秒遅らせる */
}
/* フォントカラー変更(スクロールした後) */
.js-color.is-inview {
  color: green; /* 表示領域に入ったら色を変える */
  font-size: 25px; /* 表示領域に入ったら25px */
  transition-delay: .5s; /* 開始を0.5秒遅らせる */
}


/*========= ページトップのためのCSS ===============*/

/*スクロールリンクの形状*/
.scroll-top {
  /*表示位置*/
  position: fixed;
  right: 20px;
  bottom: 10px !important;
  z-index: 2;
  /*はじめは非表示*/
  opacity: 0;
  visibility: hidden; 
  transition: opacity .5s, visibility .5s; /*それぞれに0.5秒の変化のアニメーション*/
  /*縦書き*/
  -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
  /*改行禁止*/
    white-space: nowrap;
  /*矢印の動き*/
  animation: arrowmove 1s ease-in-out infinite;
}

@keyframes arrowmove{
      0%{bottom:20px;}
      50%{bottom:25px;}
     100%{bottom:20px;}
 }


/*.scroll-viewクラスがついたら出現*/
.scroll-top.scroll-view {
  opacity: 1;
  visibility: visible;
}

/*リンク全体の aタグの形状*/
.scroll-top a {
  text-decoration: none;
  color: #666;
  text-transform: uppercase;
  font-size:0.9rem;
    display: block;
}

/*スクロールリンクの形状*/

.js-scroll a::after{
  content:"";
  position: absolute;
  top:0;
  right:0;
  width:1px;
  height: 50px;
  background:#666;
}

.js-scroll a::before {
    content: "";
    position: absolute;
    top: 30px;
    right: -6px;
    width: 1px;
    height: 20px;
    background: #666;
    transform: skewX(-31deg);
}

/*Edge IE11 hack*/
_:-ms-lang(x), .js-scroll a::before{
  right:-11px;
}

/*ページトップリンクの形状*/

.js-pagetop a::after{
  content:"";
  position: absolute;
  top:0;
  right:0;
  width:1px;
  height: 50px;
  background:#666;
}

.js-pagetop a::before {
    content: "";
    position: absolute;
    top: 0;
    right: -6px;
    width: 1px;
    height: 20px;
    background: #666;
    transform: skewX(31deg);
}

/*Edge IE11 hack*/
_:-ms-lang(x), .js-pagetop a::before{
  right:0;
}

/* Loading背景画面設定　*/
#splash {
  /*fixedで全面に固定*/
	position: fixed;
	z-index: 999;
	width: 100%;
	height: 100%;
	background:#221815;
	text-align:center;
	color:#fff;
}

/*========= 流れるテキスト ===============*/

/*全共通*/

.slide-in {
	overflow: hidden;
    display: inline-block;
}

.slide-in_inner {
	display: inline-block;

}

/*左右のアニメーション*/
.leftAnime{
    opacity: 0;/*事前に透過0にして消しておく*/
}

.slideAnimeLeftRight {
	animation-name:slideTextX100;
	animation-duration:1.3s;
	animation-fill-mode:forwards;
    opacity: 0;
}

@keyframes slideTextX100 {
  from {
	transform: translateX(-100%); /*要素を左の枠外に移動*/
        opacity: 0;
  }

  to {
	transform: translateX(0);/*要素を元の位置に移動*/
    opacity: 1;
  }
}

.slideAnimeRightLeft {
	animation-name:slideTextX-100;
	animation-duration:1.3s;
	animation-fill-mode:forwards;
    opacity: 0;
}


@keyframes slideTextX-100 {
  from {
	transform: translateX(100%);/*要素を右の枠外に移動*/
    opacity: 0;
  }

  to {
	transform: translateX(0);/*要素を元の位置に移動*/
    opacity: 1;
  }
}

#footer {
    padding: 0 !important;
    margin: 0;
    text-align: left !important;
}

.sp {display: none !important;}

.c_back {
    margin-top:0px !important;
    margin-bottom: 50px !important;
}

@media screen and (max-width: 599px) {

.collection #header2{
  height: 40px;/*高さ指定*/
  }
  
.collection #container_collection section:first-of-type{
    padding: 0 2.5%;
}
  
.our_comitment {
    background: #f5ede0;
    width: 100%;
    color: #221815;
}
.our_comitment .inner {
    width: 90%;
    max-width: 1900px;
    margin: 0 auto;
    padding: 3%;
    text-align: left;
    display: flex;
    flex-direction: column;
}

.our_comitment .inner div:nth-of-type(1) {
    width: 100%;
}

.our_comitment .inner div:nth-of-type(2) {
    width: 100%;
    padding-bottom: 5%;
}

.shadow {
  box-shadow: 0 0.5rem 1rem hsl(0 0% 0% / 20%);
  
  background: hsl(0 0% 100%);
  color: hsl(200 50% 20%);
  display: flex;
  place-items: center;
  text-align: center;
  /*border-radius: 5px;*/
 /*padding: 10px;
  border: 1px solid hsl(0 0% 83%);
  box-sizing: border-box;*/
}


.photo .inner1 div.img01 {
    margin: 0;
    max-width: 1000px;
    width: 80%;
    float: left;
    clear: both;
}

.photo .inner1 div.img11 {
    margin: -3% 0 0 0;
    max-width: 1000px;
    width: 80%;
    float: right;
}
.photo .inner1 div.img12 {
    margin: -3% 5% 0;
    max-width: 1300px;
    width: 90%;
    float: left;
    clear: both;
}

.photo .inner1 div.img02 {
    max-width: 1300px;
    width: 90%;
    float: right;
    margin: 5% 2% 0 0;
    
}

.photo .inner1 div.img03 {
    max-width: 830px;
    width: 60%;
    float: left;
    margin: -5% 0 0 0;
    clear: both;   
}

.photo .inner1 div.img04 {
    max-width: 830px;
    width: 70%;
    float: left;
    margin: 5% 0 0 15%;
    clear: both;   
}

.photo .inner1 div.img05 {
    max-width: 500px;
    width: 40%;
    float: left;
    margin: 5% 0 0 15%;
    clear: both;   
}

.photo .inner1 div.img06 {
    max-width: 500px;
    width: 40%;
    float: right;
    margin: 5% 0 0 0;  
}

.photo .inner2 {
    width: 100%;
    max-width: 1900px;
    margin: 0 auto;
    display: block;
    z-index: 5;
    position: relative;
}

.photo .inner2 div.img07 {
    max-width: 830px;
    width: 70%;
    float: left;
    margin: -5% 0 0 0%;
    z-index: 20;
    position: relative;
}

.photo .inner2 div.img08 {
    max-width: 400px;
    width: 30%;
    float: left;
    margin: -5% 0 0 0%;
    clear: both;
    z-index: 10;
    position: relative;
}

.photo .inner2 div.img09 {
    max-width: 1000px;
    width: 80%;
    float: right;
    margin: 3% 0 -5% 0;
}

.photo .inner1 div.img10 {
    max-width: 830px;
    width: 70%;
    float: left;
    margin: 5% 0 0 5%;
    clear: both;
}

.photo .inner1 div.img13 {
    max-width: 830px;
    width: 70%;
    float: right;
    margin: -3% 5% 0 0;
}

.photo .inner1 div.img14 {
    max-width: 1300px;
    width: 80%;
    float: left;
    margin: 5% 0 0 0;
    clear: both;
}

.photo .inner1 div.img15 {
     max-width: 830px;
    width: 60%;
    float: right;
    margin: -10% 0% 0 0;
    z-index: 20;
    position: relative;
}
.photo .inner1 div.img16 {
    max-width: 400px;
    width: 40%;
    float: right;
    margin: 10% -3% 0 0%;
    z-index: 10;
    position: relative;
}

.photo .inner2 div.img17 {
    max-width: 830px;
    width: 70%;
    float: left;
    margin: -3% 0 0 0%;
    clear: both;
}

.photo .inner2 div.img18 {
    max-width: 830px;
    width: 60%;
    float: right;
    margin: 5% 5% 0 0;
}

.photo .inner2 div.img19 {
    max-width: 830px;
    width: 60%;
    float: left;
    margin: -3% 0 0 0;
    clear: both;
}

.photo .inner2 div.img20 {
    max-width: 500px;
    width: 40%;
    float: right;
    margin: -20% 5% -5% 0;
    clear: both;
}

.photo .inner1 div.img21 {
    max-width: 1600px;
    width: 90%;
    float: left;
    margin: 5% 5% 0;
    clear: both;
}

.photo .inner1 div.img22 {
    max-width: 830px;
    width: 70%;
    float: left;
    margin: 5% 0 0 5%;
    clear: both;
}

.photo .inner1 div.img23 {
    max-width: 830px;
    width: 70%;
    float: right;
    margin: 5% 5% 0 0;
}
.photo .inner2 div.img24 {
    max-width: 830px;
    width: 70%;
    float: left;
    margin: -5% 0 0 5%;
}

.photo .inner2 div.img25 {
    max-width: 830px;
    width: 70%;
    float: right;
    margin: 5% 0 0 0;
}

.photo .inner2 div.img26 {
    max-width: 830px;
    width: 70%;
    float: left;
    margin: -3% 0 0 10%;
    clear: both;
}

.photo .inner2 div.img27 {
    max-width: 830px;
    width: 60%;
    float: right;
    margin: 3% 0 0 0%;
    clear: both;
}

.photo .inner2 div.img28 {
    max-width: 500px;
    width: 40%;
    float: left;
    margin: -30% 0 0 5%;
    clear: both;
}

.photo .inner2 div.img29 {
    max-width: 500px;
    width: 40%;
    float: left;
    margin: 5% 0 -5% -2%;
}

.photo .inner1 div.img30 {
    max-width: 830px;
    width: 70%;
    float: left;
    margin: 5% 0 0 5%;
    clear: both;
}

.photo .inner1 div.img31 {
    max-width: 500px;
    width: 40%;
    float: right;
    margin: 5% 0% 0 0;
}

.photo .inner1 div.img32 {
    max-width: 500px;
    width: 40%;
    float: left;
    margin: -40% 0 0 30%;
    clear: both;
}

.photo .inner1 div.img33 {
    max-width: 500px;
    width: 40%;
    float: left;
    margin: 5% 0 0 5%;
    clear: both;
}

.photo .inner1 div.img34 {
    max-width: 830px;
    width: 60%;
    float: left;
    margin: 5% 0 0 0;
    clear: both;
}

.photo .inner1 div.img35 {
    max-width: 1300px;
    width: 90%;
    float: right;
    margin: -20% 0 0 0%;
}

.photo .inner1:last-of-type {
    padding: 3% 0 5% 0;
}

.sp{display: inherit;}

.c_sp {
    display: block !important;
}
.c_pc {display: none !important;}

.c_back {
    margin-top:50px !important;
    margin-bottom: 50px !important;
}

.c_pankuzu { position: relative; margin: 0 0px; padding: 0px 2%; border-top: 1px solid #d7d7d7; background: #f8f8f8; letter-spacing: -0.4em; display: block; width: 96%; }
.c_pankuzu li { letter-spacing: 0px; display: inline; line-height: 34px; font-size: 32px !important; font-size: 1.14286rem !important; background: url(/assets/images/common/parts/spacer.gif) no-repeat; }
.c_pankuzu li a { color: #e60012; display: inline; font-size: 32px !important; font-size: 1.14286rem !important; }
.c_pankuzu li + li:before { font-family: 'icomoon' !important; font-weight: normal !important; font-style: normal !important; text-indent: 0px; display: inline-block; vertical-align: middle; letter-spacing: 0px; line-height: initial; font-size: 16px; font-size: 0.57143rem; content: '\e919'; color: #d7d7d7; padding: 0 12px; line-height: 24px; vertical-align: baseline; }
.c_pankuzu li + li { position: relative; padding-left: 0; background: none !important; }

.c_button1 {max-width: 384px; width: 90% !important;}



#footer { background: #f8f8f8; padding: 0 0 50px; font-size: 32px !important; font-size: 1.14286rem !important; margin: 20px 0 0; text-align: left !important; position: relative;} 
#footer .c_inner { margin: 0; position: inherit !important; padding-top: 0 !important; width: 100%;}
#footer .nav_box1 { display: none; }
#footer .nav_box2 {float:left; margin-bottom:0 !important; width: 100% !important;}
#footer .nav_box2 dl dt { display: none !important; }
#footer .nav_box2 .social ul { margin-bottom: -1px !important; }
#footer .nav_box2 .social dd a { font-style: oblique; padding-left: 74px !important; }
#footer .nav_box2 .social dd a.facebook, #footer .nav_box2 .social dd a.youtube { position: relative; }
#footer .nav_box2 .social dd a.facebook:before, #footer .nav_box2 .social dd a.youtube:before { font-family: 'icomoon' !important; font-weight: normal !important; font-style: normal !important; text-indent: 0px !important; display: inline-block !important; vertical-align: middle !important; letter-spacing: 0px !important; line-height: initial !important; position: absolute !important; left: 20px !important; top: 50% !important; margin-top: -16px !important; vertical-align: middle !important; font-size: 22px !important; font-size: 1.14286rem; }
#footer .nav_box2 .social dd a.facebook:before { content: '\e91e'; color: #3b5998 !important; }
#footer .nav_box2 .social dd a.youtube:before { content: '\e90f'; color: #e60012 !important; }
#footer .nav_box2 .button { overflow: hidden; border-bottom: 1px solid #d7d7d7; }
#footer .nav_box2 .button li { float: left; width: 50%; margin-right: -1px; border-right: 1px solid #d7d7d7; border-top: 1px solid #d7d7d7; }
#footer .nav_box2 .button li:nth-child(2) { margin-bottom: -1px; border-bottom: 1px solid #d7d7d7; }
#footer .nav_box2 .button li a { padding: 0 0 0 20px !important; line-height: 30px !important; height: 60px !important; width: 50% !important; display: table-cell !important; vertical-align: middle !important; text-align: left !important;}
#footer .nav_box2 .button li a span { display: inline !important; }
#footer .bottom { clear: both !important; position: relative !important; text-align: left; padding-top: 30px;}
#footer .bottom .logo { position: relative !important; bottom: 6px !important; margin-bottom: 0px !important; line-height: 0 !important; display: inline-block;}
#footer .bottom .logo img { max-width: 161px !important; width: 100%; }
#footer .bottom .copyright { line-height: 0 !important; padding-top: 0px !important; padding-left: 20px !important; padding-right: 10px; margin-bottom: 0px !important; left:0 !important; float: left; position: relative !important; right: inherit !important;}
#footer .nav_box2 .button li + li {margin-top: 0 !important;}
#footer .nav_box2 .button a {border: none !important;}
#footer .nav_box2 .social {margin-bottom: 0 !important;}
#footer .nav_box2 .button li a.facebook, #footer .nav_box2 .button li a.youtube{padding-left: 50px !important;}
}