@charset "UTF-8";
<style type="text/css">{}


body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
.TOP {
	color:#FFF;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-style:normal;
	font-weight:bold;
	font-size:13px;
	text-align:right;
	padding-bottom: 0px;
	padding-top: 2px;
	background-color:#CCDFEE;
	margin-top:0em;
	margin-left:-1.2em;
	margin-right:2em;
	width:100%;
	float:left;
	/*border: solid 0px #DDD;*/
}
.PRE {
	color:#FFF;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-style:normal;
	font-weight:bold;
	font-size:13px;
	text-align:LEFT;
	padding-bottom: 0px;
	padding-top: 2px;
	background-color:#DDD;
	margin-top:0em;
	margin-left:-1.2em;
	margin-right:2em;
	width:100%;
	float:left;
	/*border-right:solid 0.2em #FFF;*/
}
.NEXT {
	color:#FFF;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-style:normal;
	font-weight:bold;
	font-size:13px;
	text-align:RIGHT;
	padding-bottom: 0px;
	padding-top: 2px;
	background-color:#CCC;
	margin-top:0em;
	margin-left:-1.2em;
	margin-right:2em;
	width:100%;
	float:left;
	/*border-right:solid 0.2em #FFF;*/
}
.TEXT-1 {
	color:#666;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-style:normal;
	font-weight:normal;
	font-size:14px;
	line-height:1.5em;
	margin-top: 0.5em;
	margin-bottom: 0.2em;
	text-align: left;
	margin-left:-0.7em;
}
.TEXT-2 {
	color:#777;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-style:normal;
	font-weight:normal;
	font-size:11px;
	line-height:1.4em;
	margin-top: 0.5em;
	margin-bottom: 0.2em;
}
.TEXT-3 {
	color:#777;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-style:normal;
	font-weight:normal;
	font-size:13px;
	line-height:1.4em;
	margin-top: 0.5em;
	margin-bottom: 0.2em;
}
.TITLE-1 {
	color:#009898;
	font-family:"ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-style:normal;
	font-weight:bold;
	font-size:15px;
	line-height:1.5em;
	margin-top: 0em;
	margin-bottom: 0em;
	text-align: left;
	margin-left:-1em;
}









.MAX {
    max-width: 1150px; /* 最大幅880 */
   /*min-width: 240px; /* 最小幅 */
}
/*.resizeimage img { width: 100%; }*/




#wrapper {
    padding: 50px 0;
    background: #fff;
    text-align: center;
    overflow: hidden; }

  h2 + div {
    margin-bottom: 80px;
  }

  .loop_css {
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row nowrap;
	flex-flow: row nowrap;
	width: 100vw;
	overflow: hidden;
  }

  .loop_css ul {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row nowrap;
    flex-flow: row nowrap;
    width: 100%;
    margin: 0;
    padding: 0;
  }

  .loop_css li {
    display: inline-block;
    width: calc(100vw / 2);
    min-width: 180px;
    margin: 0 23px 0 0;
    list-style: none;
    text-align: center;
  }

  .loop_css li a {
    display: block;
  }

  .loop_css li img {
    display: block;
    width: 100%;
    height: auto;
  }

  .loop_css li a:hover {
    opacity: .7;
  }

  .loop_css ul:first-child {
    -webkit-animation: loop 55s 0s linear infinite;		/*50-25-----1300	60-30---1400		-31s*/
    animation: loop 55s 0s linear infinite;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
  }

  .loop_css:hover ul {
    /*animation-play-state: paused;*/
  }

  @-webkit-keyframes loop {
    0% {
      -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
      transform: translateX(100%);
    }
    to {
      -webkit-transform: translateX(-3300px);			/*約200×コマ数*/
      -ms-transform: translateX(-3300px);
      transform: translateX(-3300px);
    }
  }

  @keyframes loop {
    0% {
      -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
      transform: translateX(100%);
    }
    to {
      -webkit-transform: translateX(-3300px);
      -ms-transform: translateX(-3300px);
      transform: translateX(-3300px);
    }
  }



.horizontal-list {
	overflow-x: auto;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
    }
.item {/* 横スクロール用 */
    display: inline-block;
	/*height:300px;*/
	/* 見た目調整 */
    /*width: 35%;*/
	margin-left:-30px;
	margin-right: 45px;
	font-size: 12px;
	list-style: none;
	text-align: center;
	/*background-color: #CCC;*/
    }
	


img.center {
    display: block;
    margin-left: auto;
    margin-right: auto }

img.right {
    display: block;
    margin: 0 0 0 auto;}





.sa {
  opacity: 0;
  transition: all 1.6s ease;
}
 
.sa.show {
  opacity: 1;
  transform: none;
}
 
.sa--lr {
  transform: translate(-600px, 0);
}
 
.sa--rl {
  transform: translate(600px, 0);
}
 
.sa--up {
  transform: translate(0, 300px);
}
 
.sa--down {
 /* transition-delay:0.5s;*/
  transform: translate(0, -800px);
}


.sa--scaleUp {
  transform:scale(0.5);
}
.sa--scaleUp1 {
  transform:translate(0, -200px) scale(0.5);
}
.sa--scaleUp2 {
  transform:translate(0, -400px) scale(0.0001);
}
.sa--scaleUp3 {
  transform:translate(0, -900px) scale(0.0001);
}
.sa--scaleUp4 {
  transform:translate(0, -1500px) scale(0.0001);
}


.sa--scaleDown {
  transform:scale(1.5);
}
 
.sa--scaleDown2 {
  transform: translate(0px, -500px) scale(2.0001);
}

.sa--rotateL {
  transform: rotate(180deg);
}
 
.sa--rotateR {
  transform: rotate(-80deg);
}



</style>