/* レスポンシブ */
body {
    height: auto;
}








@media screen and (min-width:768px) { 
.desktopin { 
display:block;
}
.mobilein { 
display:none;
}
}
@media screen and (max-width:767px) { 
.desktopin { 
display:none;
}
.mobilein { 
display:block;
}
}







.swiper-wrap{
position: relative;
ackground-image: url('../images/bg.jpg');
background-size: cover;
background-position: center center;
}

.swiper-container1 {
position: relative;
overflow: hidden;
height: auto;
padding: 0 0 60px;
background-size: cover;
background-position: center center;
width: 100%;
margin: auto;
}
@media screen and (max-width:767px) { 
.swiper-container1 {
width: 100%;
}
}
.swiper-container {
position: relative;
overflow: hidden;
height: auto;
padding: 0 0 60px;
background-size: cover;
background-position: center center;
width: 100%;
margin: auto;
}
@media screen and (max-width:767px) { 
.swiper-container {
width: 80%;
}
}
.swiper-container3 {
    position: relative;
    overflow: hidden;
    height: auto;
    padding: 0 40px 60px;
    background-size: cover;
    background-position: center center;
    width: 100%;
    margin: auto;
    }
    @media screen and (max-width:767px) { 
    .swiper-container3 {
    padding: 0 30px 60px;
    }
    }

.swiper-slide {
align-items: center;
justify-content: center;
}

.swiper-slide img {
display: inline;
width: auto;
max-width: 100%;
max-height: ;
align-self: center;
margin-top: 20px;
}
@media screen and (max-width:767px) { 
.swiper-slide img {
margin-top: 10px;
}
}

.swiper-button-white:focus {
outline: none;
}

.swiper-button-next,
.swiper-button-prev {
--swiper-navigation-color: #13B5BB; //ここに変更する色を指定
}
/* SPは矢印を見た目非表示(desktopin/mobileinと合わせて完全非表示) */
.swiper-button-next::after, 
.swiper-button-prev::after {
content: none !important;
}
@media screen and (max-width:767px) { 
.swiper-button-next::after, 
.swiper-button-prev::after {
content: none !important;
}
}

/* 次へ前へボタン　共通 */
.swiper-button-prev,
.swiper-button-next {
width: 34px; 
height: 40px; 
background-size: 34px 40px;
margin-top: -24px;
}
@media screen and (max-width:767px) { 
.swiper-button-prev,
.swiper-button-next {
width: 26px; 
height: 30px; 
background-size: 26px 30px;
margin-top: -240px; /* 縦中央配置用：ボタンの高さの半分のネガティブマージン（top:50%がすでに設定されている） */
}
}
/* 次へボタン */
.swiper-button-next {
background-image:url("../images/top/Arrow.png");
right: 0;
}
@media screen and (max-width:767px) { 
.swiper-button-next {
right: 0;
}
}
/* 前へボタン */
.swiper-button-prev {
background-image:url("../images/top/Arrow.png");
left: 0;
transform: scale(-1, 1); /* 左右反転 */
}
@media screen and (max-width:767px) { 
.swiper-button-prev {
left: 0;
}
}
.swiper-button-prev:after,
.swiper-button-next:after {
font-family: swiper-icons;
font-size: var(--swiper-navigation-size);
text-transform: none !important;
letter-spacing: 0;
text-transform: none;
font-variant: initial;
}

/* ページネーション */
.swiper-pagination-bullet {
width: 12px; /* 幅 */
height: 12px; /* 高さ */
background: #1ad9e0; /* 色：緑 */
opacity: 0.3; /* 半透明（デフォルトでは0.2） */
}
/* 現在 */
.swiper-pagination-bullet-active {
width: 12px; /* 幅 */
height: 12px; /* 高さ */
background: #1ad9e0; /* 色：黄色 */
opacity: 1; /* 不透明 */
}

/* 中のボタン */
/* 1 */
.btnSL1-wrap {
margin-top: 30px;
z-index: 70;
position: absolute;
text-align: center;
left: 0;
right: 0;
top: 76%;
}
@media screen and (max-width:767px) { 
.btnSL1-wrap {
margin-top: 20px;
top: 75%;
}
}

.btnSL1 {
font-size: 2rem;
font-weight: 700;
line-height: 1.2;
position: relative;
display: inline-block;
padding: 1.5rem 0rem;
cursor: pointer;
user-select: none;
transition: all .3s;
text-align: center;
vertical-align: middle;
text-decoration: none;
letter-spacing: .1em;
border-radius: .5rem;
line-height: 2rem;
width: 40%;
}
@media screen and (max-width:767px) { 
.btnSL1 {
font-size: 1.5rem;
padding: 1.5rem 0rem;
line-height: 1.5rem;
width: 80%;
}
}
.btnSL1:before {
font-family: 'Font Awesome 5 Free';
font-size: 1.2rem;
line-height: 1;
position: absolute;
top: calc(50% - .7rem);
right: .5rem;
margin: 0;
padding: 0;
content: '\f054';
}

.btnSL1--green {
color: #fff;
background-color: #15ced6;
order: 1px solid #000;
}
.btnSL1--green:hover {
color: #fff;
background-color: #17dce4;
}
.btnSL1--green2 {
color: #fff;
background-color: #e60000;
order: 1px solid #000;
}
.btnSL1--green2:hover {
color: #fff;
background-color: #ff0000;
}

/* 2 */
.btnSL-wrap {
margin-top: 10px;
z-index: 70;
position: relative;
text-align: center;
left: 0;
right: 0;
top: 76%;
}
@media screen and (max-width:767px) { 
.btnSL-wrap {
margin-top: 20px;
top: 75%;
}
}

.btnSL {
font-size: 1.2rem;
font-weight: 700;
line-height: 1.2;
position: relative;
display: inline-block;
padding: 1rem 0rem;
cursor: pointer;
user-select: none;
transition: all .3s;
text-align: center;
vertical-align: middle;
text-decoration: none;
letter-spacing: .1em;
border-radius: .5rem;
width: 100%;
}
@media screen and (max-width:767px) { 
.btnSL {
}
}

.btnSL:before {
font-family: 'Font Awesome 5 Free';
font-size: 1.2rem;
line-height: 1;
position: absolute;
top: calc(50% - .7rem);
right: .5rem;
margin: 0;
padding: 0;
content: '\f054';
}
@media screen and (max-width:767px) { 
.btnSL:before {
content: none;
}
}

.btnSL--green {
color: #fff;
background-color: #15ced6;
order: 1px solid #000;
}
.btnSL--green:hover {
color: #fff;
background-color: #15ced6;
}
.btnSL--green2 {
color: #fff;
background-color: #ff9494;
order: 1px solid #000;
}
.btnSL--green2:hover {
color: #fff;
background-color: #ff9494;
}

.mocchiri {
animation: mocchiri 4s infinite;
}
@keyframes mocchiri {
0% {
transform: scale(1);
}
50% {
transform: scale(0.95);
}
100% {
transform: scale(1);
}
}
/* ------------キラリ------------ */
.shinybtn {   
overflow: hidden;
}
.shinybtn::before {
position: absolute;
content: '';
top: -180px;
left: 0;
width: 30px;
height: 100%;
background-color: #fff;
animation: shinybtn 4s ease-in-out infinite;
}
@-webkit-keyframes shinybtn {
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

/* 中のテキスト */
.swiper-slide h3 {
font-weight: bold;
font-size: 1.4em;
color: #42546A;
text-align: center;
padding: 0;
margin: 0.5em 0 0;
}
@media screen and (max-width:767px) { 
.swiper-slide h3 {
font-size: 1em;
}
}

.swiper-slide p {
font-size: .8em;
padding: 0;
margin-top: 10px;
}

.title_nic ul {
margin-top: 10px;
}
@media screen and (max-width:767px) { 
.title_nic ul {
text-align: center;
}
}

.title_nic ul li {
display: inline-block;
font-size: 0.6em;
    font-weight: bold;
    color: #FFF;
    background-color: #ff9494;
    vertical-align: middle;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    padding: 2px 9px;
    margin: 2.5px;
}










/* トップスライド補助 */
.swiper-parent {
max-width: 2000px;
margin: auto;
}
.swiper-slideSub {
display: flex;
align-items: center;
justify-content: center;
}