@charset "utf-8";

#atl_wrap{
	width: 100%;
	text-align: center;
    margin: 0 auto 5%;
	color: #3c3c3c;
    display: block;
	line-height: 1.4;
    position: relative;
    font-family: "Yu Gothic Medium", "Yu Gothic", "游ゴシック", "游ゴシック体", "Helvetica Neue", HelveticaNeue, YuGothic, Verdana, Meiryo, sans-serif;
    font-weight: normal;
    font-feature-settings: "palt";
    letter-spacing: 0.05em;
}

#atl_wrap hr{
    border: none;
    border-top: 1px solid #e2e2e2;
}

#atl_wrap .inner{
    width: 1000px!important;
    margin: 0 auto;
}

*:focus {
outline: none;
}
#atl_wrap ul{
    margin: 0;
    padding: 0;
}
#atl_wrap li{
    list-style: none;
}
#atl_wrap a {
    text-decoration: none;
}
#atl_wrap a:link{
    opacity: 1;
}
#atl_wrap a:hover{
    text-decoration: none;
}
#atl_wrap img {
	width: 100%;
    border: none;
    vertical-align: bottom;
    line-height: inherit;
}

#atl_wrap .head_box .head_img{
    margin: 0 0 70px;	
}

#atl_wrap .head_box .title{
    position: static;
    color: #4fa9c3;
    font-size: 22px;
    line-height: 1.64;
    font-weight: bold;
    margin: 0 0 20px;
}

#atl_wrap .head_box .lead{
    font-size: 16px;
    line-height: 2;
    padding: 0;
    margin: 0 0 22px;
}
#atl_wrap .head_box .releasedate{
    text-align: left;
    font-size: 16px;
    color: #333333;
    margin: 0;
    padding: 39px 0 80px 29px;
    line-height: 1;
    font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
}

.main_wrap{
    width: 100%;
	text-align: center;
	padding-bottom: 50px;
}

.main_wrap .title img{
	margin: 0 0 80px;
}

.item_wrap{
	display: flex;
	flex-wrap: wrap;
	gap: 67px 60px;
	text-align: left;
	align-items: start;
	justify-content: center;
}

.item_wrap .item{
	width: 47%;
	margin: 0 auto;
}

.item_wrap .item img{
	margin: 0 0 29px;
}

.item_wrap .lead{
	font-size: 16px;
    letter-spacing: .06em;
    line-height: 1.75;
    margin-bottom: 20px;
}

.item_wrap .item_credit{
	font-size: 14px;
}

.item_wrap .item_credit a{
	color: #333333;
	text-decoration: underline!important;
	line-height: 1.8;
}


/************************************************************
スライダー
************************************************************/
.slider-container,
.slider-container2,
.slider-container3,
.slider-container4,
.slider-container6,
.slider-container7,
.slider-container8,
.slider-container9,
.slider-container10{
  width: 100%; /* スライダー全体の幅 */
  margin: 0 auto;
  overflow: hidden; /* 親要素からはみ出た部分を隠す */
  position: relative;
}

.slider-slides {
  display: flex; /* 画像を横並びにする */
  width: 400%; /* (画像4枚分) = 画像1枚の幅(100%) × 4枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-slides2,
.slider-slides3,
.slider-slides4,
.slider-slides6,
.slider-slides7,
.slider-slides8{
  display: flex; /* 画像を横並びにする */
  width: 200%; /* (画像2枚分) = 画像1枚の幅(100%) × 2枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-slides9,
.slider-slides10{
  display: flex; /* 画像を横並びにする */
  width: 300%; /* (画像3枚分) = 画像1枚の幅(100%) × 3枚 */
  transition: transform 0.5s ease; /* スライドのアニメーション */
}

.slider-image {
  width: 100%;
}

.slider-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* ラジオボタンを非表示にする */
.slider-slides input,
.slider-slides2 input,
.slider-slides3 input,
.slider-slides4 input,
.slider-slides6 input,
.slider-slides7 input,
.slider-slides8 input,
.slider-slides9 input,
.slider-slides10 input{
  display: none;
}

/* ラジオボタンがチェックされた時にスライドを切り替える */
#slide1_1:checked ~ .slider-image.slide1_1,
#slide1_2:checked ~ .slider-image.slide1_2,
#slide1_3:checked ~ .slider-image.slide1_3,
#slide1_4:checked ~ .slider-image.slide1_4,
#slide2_1:checked ~ .slider-image.slide2_1,
#slide2_2:checked ~ .slider-image.slide2_2,
#slide3_1:checked ~ .slider-image.slide3_1,
#slide3_2:checked ~ .slider-image.slide3_2,
#slide4_1:checked ~ .slider-image.slide4_1,
#slide4_2:checked ~ .slider-image.slide4_2,
#slide6_1:checked ~ .slider-image.slide6_1,
#slide6_2:checked ~ .slider-image.slide6_2,
#slide7_1:checked ~ .slider-image.slide7_1,
#slide7_2:checked ~ .slider-image.slide7_2,
#slide8_1:checked ~ .slider-image.slide8_1,
#slide8_2:checked ~ .slider-image.slide8_2,
#slide9_1:checked ~ .slider-image.slide9_1,
#slide9_2:checked ~ .slider-image.slide9_2,
#slide9_3:checked ~ .slider-image.slide9_3,
#slide10_1:checked ~ .slider-image.slide10_1,
#slide10_2:checked ~ .slider-image.slide10_2,
#slide10_3:checked ~ .slider-image.slide10_3{
  /* ここは直接的な画像表示のスタイルではないので注意 */
}

#slide1_1:checked ~ .slider-image,
#slide1_2:checked ~ .slider-image,
#slide1_3:checked ~ .slider-image,
#slide1_4:checked ~ .slider-image,
#slide2_1:checked ~ .slider-image,
#slide2_2:checked ~ .slider-image,
#slide3_1:checked ~ .slider-image,
#slide3_2:checked ~ .slider-image,
#slide4_1:checked ~ .slider-image,
#slide4_2:checked ~ .slider-image,
#slide6_1:checked ~ .slider-image,
#slide6_2:checked ~ .slider-image,
#slide7_1:checked ~ .slider-image,
#slide7_2:checked ~ .slider-image,
#slide8_1:checked ~ .slider-image,
#slide8_2:checked ~ .slider-image,
#slide9_1:checked ~ .slider-image,
#slide9_2:checked ~ .slider-image,
#slide9_3:checked ~ .slider-image,
#slide10_1:checked ~ .slider-image,
#slide10_2:checked ~ .slider-image,
#slide10_3:checked ~ .slider-image{
  transition: transform 0.5s ease;
}

#slide1_1:checked ~ .slider-image {
  transform: translateX(0);
}
#slide1_2:checked ~ .slider-image {
  transform: translateX(-100%);
}
#slide1_3:checked ~ .slider-image {
  transform: translateX(-200%);
}
#slide1_4:checked ~ .slider-image {
  transform: translateX(-300%);
}

#slide2_1:checked ~ .slider-image,
#slide3_1:checked ~ .slider-image,
#slide4_1:checked ~ .slider-image,
#slide6_1:checked ~ .slider-image,
#slide7_1:checked ~ .slider-image,
#slide8_1:checked ~ .slider-image{
  transform: translateX(0);
}
#slide2_2:checked ~ .slider-image,
#slide3_2:checked ~ .slider-image,
#slide4_2:checked ~ .slider-image,
#slide6_2:checked ~ .slider-image,
#slide7_2:checked ~ .slider-image,
#slide8_2:checked ~ .slider-image{
  transform: translateX(-100%);
}

#slide9_1:checked ~ .slider-image,
#slide10_1:checked ~ .slider-image{
  transform: translateX(0%);
}
#slide9_2:checked ~ .slider-image,
#slide10_2:checked ~ .slider-image{
  transform: translateX(-100%);
}
#slide9_3:checked ~ .slider-image,
#slide10_3:checked ~ .slider-image {
  transform: translateX(-200%);
}

/* ナビゲーションドットのスタイル */
.slider-nav1,
.slider-nav2,
.slider-nav3,
.slider-nav4,
.slider-nav6,
.slider-nav7,
.slider-nav8,
.slider-nav9,
.slider-nav10{
    text-align: center;
    margin-top: 10px;
}

.slider-nav1 .arrow_next,
.slider-nav2 .arrow_next,
.slider-nav3 .arrow_next,
.slider-nav4 .arrow_next,
.slider-nav6 .arrow_next,
.slider-nav7 .arrow_next,
.slider-nav8 .arrow_next,
.slider-nav9 .arrow_next,
.slider-nav10 .arrow_next{
	display: inline-block;
    width: 32px;
    height: 62px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/next.png");
	background-repeat: no-repeat;
}

.slider-nav1 .arrow_prev,
.slider-nav2 .arrow_prev,
.slider-nav3 .arrow_prev,
.slider-nav4 .arrow_prev,
.slider-nav6 .arrow_prev,
.slider-nav7 .arrow_prev,
.slider-nav8 .arrow_prev,
.slider-nav9 .arrow_prev,
.slider-nav10 .arrow_prev{
    display: inline-block;
    width: 32px;
    height: 62px;
    cursor: pointer;
    transition: background-color 0.3s;
	background-image: url("../images/prev.png");
	background-repeat: no-repeat;
}
		
.pos1{
    position: absolute;
    top: 40%;
    left: -1px;
}

.pos2{
    position: absolute;
    top: 40%;
    right: -1px;
}

.pos3{
    position: absolute;
    top: 40.5%;
    left: -1px;
}

.pos4{
    position: absolute;
    top: 40.5%;
    right: -1px;
}

.pos5{
    position: absolute;
    top: 35%;
    left: -1px;
}

.pos6{
    position: absolute;
    top: 35%;
    right: -1px;
}

.slider-image .txt{
	font-size: 16px;
    line-height: 1.8;
    margin: 33px 0 0 0;
    padding: 0;
    text-align: left;
}


/************************************************************
other
************************************************************/
.sp {
	display:none;
}
.pc{
    display: block;
}

/************************************************************
 ボタン
************************************************************/

.btn_all a {
    background: #4fa9c3;
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    width: 90%;
    line-height: 2em;
    letter-spacing: 1px;
    margin: 15% auto 10%;
    display: inline-block;
    padding: 4.5% 0
}

/************************************************************
 sp
************************************************************/

@media only screen and (max-width:768px){
	
    #atl_wrap .inner{
        width: 100%!important;
    }
	
    #atl_wrap .head_box .head_img{
        margin: 0 0 35px;
    }	

    #atl_wrap .head_box .title{
        font-size: 18px;
    }	
	
    #atl_wrap .head_box .lead {
        font-size: 14px;
		margin: 10% auto 0;
    }	
	
    #atl_wrap .head_box .releasedate {
        font-size: 13px;
        padding: 55px 0 20px 10px;
    }
	
	.main_wrap{
		padding-bottom: 0;
	}
	
    .main_wrap .title img{
        margin: 10% auto 30px;
		width: 90%!important;
    }	

    .item_wrap {
        gap: 30px 0;
    }	
	
    .item_wrap .item {
        width: 90%;
    }	
	
    .item_wrap .item img {
        margin: 0 0 15px;
    }	
	
    .item_wrap .lead {
        font-size: 13px;
		margin-bottom: 15px;
    }	

    .item_wrap .item_credit {
        font-size: 12px;
		margin: 10px 0 20px;
    }
	
	.pc {
		display: none;
	}
	.sp {
		display: block;
		width: 100%;
	}

}

