.box{margin: 0 auto;
  text-align: center;
  width:100%;
  padding:10px;
  }

.h2 {
  font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-weight: bold;
  font-size: 2.2rem;
  padding: 0.1rem 0.8rem;
  border-left: 15px solid #16A6B6;
  margin-top: 3rem;
  margin-bottom: 1rem;
  }
  .h2 a{text-decoration: none;}

  .attention {
  margin:5px;
  color: #EE6557;/*文字色*/
  border: solid 3px #EE6557;/*線色*/
  padding: 0.5em;/*文字周りの余白*/
  border-radius: 0.5em;/*角丸*/
  }

/*index画像切替*/
.album {
	margin: 0 0 2rem 0;
  position: relative;
}

.album img {
	width: 100%;
	animation-name: album;
	-webkit-animation-name: album;
	animation-duration: 24s;
	-webkit-animation-duration: 24s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	opacity: 0;
}

.album .img1 {
	display: block;
	margin: 0 auto;
}
.album .img2 {
	animation-delay:8s;
	-webkit-animation-delay:8s;
	position: absolute;
	top: 0;
}
.album .img3 {
	animation-delay:16s;
	-webkit-animation-delay:16s;
	position: absolute;
	top: 0;
}

.album p{position: absolute;
  bottom: -10%;
  right: 15%;
  margin: 0; /*余計な隙間を除く*/
  background: #363947;/*背景色*/
  color:#fff;
  font-size:2.4rem;
  font-weight: bold;
  vertical-align:bottom;
  line-height: 4.0rem;/*行高は1に*/
  padding: 0.8em 1.2em;/*文字周りの余白*/
  font-family: "游明朝","Yu Mincho","HG正楷書体-PRO","ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", "Yu Gothic",serif;
  writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
-webkit-writing-mode:vertical-rl;
  opacity: 0.8;/*透過率*/
  }

.news {
  color: #EE6557;/*文字色*/
	position: relative;
	padding: .8em .3em .5em .3em;
	border: 3px solid #EE6557;
  border-radius: 0.5em;/*角丸*/
  margin:0.5em 1em 1.5em 1em;
  }
.news::after{
	content: "News!";
	position: absolute;
	top: -8px;
	left: 10px;
	background: #fafcfc;
	font-size: 14px;
	color: #EE6557;
	padding: 0 10px;
}

@keyframes album {
	0% {		opacity: 0;	}
	12.5% {		opacity: 1;	}
	37.5% {		opacity: 1;	}
	50% {		opacity: 0;	}
}
@-webkit-keyframes album {
	0% {		opacity: 0;	}
	12.5% {		opacity: 1;	}
	37.5% {		opacity: 1;	}
	50% {		opacity: 0;	}
}

@media only screen and (max-width:600px) {
.album{margin-bottom: 0.2rem;}
.album p{
  position: static;
  text-align:  center;
  color:#333;
  background: #fff;/*背景色*/
  padding-top: 0.5em;/*文字周りの余白*/
  writing-mode: horizontal-tb;
  -ms-writing-mode: tb-rl;
  -webkit-writing-mode:horizontal-tb;
opacity: 0.9;/*透過率*/}
}

.index_con ul{margin-top: 3rem;
}
@media only screen and (max-width:600px) {
  .index_con ul{margin-top: 1.5rem;}
}
.index_con li{
  display: inline-block;
  width:48%;
  vertical-align: top;
  margin-bottom: 10px;
    }

  .index_con a img{
      border-radius: 10%;
      -ms-transition-duration: 0.2s;
      transition-duration : 0.2s;
      }

  .index_con a:hover img{
      border-radius: 0%;
      }

  .index_con p{
  padding:10px;
  padding-bottom:2px; }

  .index_h2{
  position: relative;
	padding:0 0 0 10px;
  margin-top:10px;
	font-size:1.6rem;
	border-bottom:#BFBFBF dotted 1px;}

  .index_h2:first-letter{
	font-size:2.5rem;
	color:#325A8C;
}

@media only screen and (max-width:600px) {
  .index_h2{
  margin-top:2px;
	}
}

/*********** company ***********/
/* 会社概要 */
.company_text{margin:2em;
margin-bottom: 4em;
}

#daihyo{text-align: right;
font-weight: bold;
font-size:1.2em;
font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
margin-top: 1.5em;
}

.company dl {
  font-size: 0.9em;
  }
.company dt {
    float: left;
  	padding: 20px;
  	margin: 0px;
  	color: #737373;
  }
.company dd {
  color:#181818;
  border-bottom: 1px dotted #BFBFBF;
  padding: 20px 20px 20px 160px;
  margin: 0px;
  }

.privacy li{
  margin-left:2em;
  font-size:0.9em;
  list-style-type: disc;}


  @media only screen and (max-width:600px) {
    .company dt , .company dd{
      float: none;
      padding: 10px;
      margin: 0;
      width: auto;}
    }

/***shopping****/
.shopping dl {
  font-size: 0.9em;
  }
.shopping dt {
    float: left;
  	padding: 20px;
  	margin: 0px;
  	color: #737373;
  }
.shopping dd {
  color:#181818;
  border-bottom: 1px dotted #BFBFBF;
  padding: 20px 20px 20px 160px;
  margin: 0px;
  }

  @media only screen and (max-width:600px) {
    .shopping dt , .shopping dd{
      float: none;
      padding: 10px;
      margin: 0;
      width: auto;}
    }
