@charset "UTF-8";
/*-------------------------------------------
トップページ
-------------------------------------------*/

.top_gaikan {
  position:relative;
    max-width: 100%;
}
.top_gaikan .txt{
  position:absolute;
    top : 15%;
    left: 15%;
    z-index: 1;
}
.txt img {
    width: 150px;
}

.anim–box.slidein.is–animated {
animation: slideIn 1s cubic–bezier(0.25, 1, 0.5, 1) 1 forwards;
}
@keyframes slideIn {
0% {
transform: translateX(180px);
opacity: 0;
}
100% {
transform: translateX(0);
}
40%,100% {
opacity: 1;
}
}

.wp-block-image img {
  width: 100%;
}

.top_gaikan .gaikan_photo img{
  width: 100%;
      height: 1000px;
    object-fit: cover;
    object-position: 50% 75%;
}
.news_titl {
    display: flex;
    align-items: center;
}
.topic a{
    margin-left: 20px;
    color: #000;
    font-size: 1.5rem;
    position: relative;
}
.news_jikan {
  position:absolute;
    width: 1100px;
    margin: 0 auto;
    display: flex;
    padding: 20px 50px;
    background-color: #fff;
    z-index: 2;
    left: 50%;
    bottom: 3%;
    transform: translate(-50%, 0%);
}

.news {
    width: 50%;
    padding-right: 2%;
    
}
.news-row_wrapper {
    display: flex;
    align-items: center;
    padding: 20px 5px;
    border-bottom: 1px dotted #000;
}
.news-classification {
    display: flex;
    align-items: center;
}
.news-date_wrapper {
    display: flex;
    align-items: center;
}
.information , .update {
    color: #06658c;
    width: 80px;
    font-size: 1.3rem;
    text-align: center;
    border: solid 1px  #06658c;
    border-radius: 100vh;
    margin-right: 10px;
}
.important {
    color: #c02d31;
    width: 80px;
    font-size: 1.3rem;
    text-align: center;
    border: solid 1px #c02d31;
    border-radius: 100vh;
    margin-right: 10px;
}
.important ~ div {
    color: #c02d31;
}
.important ~ div a{
    color: #c02d31;
}
.news-date {
    font-size: 1.2rem;
    margin-right: 20px;
}
.news-content {
    font-size: 1.4rem;
}
.news-content p{
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.news-content a {
   color: #000;
}

.top_jikan {
    width: 50%;
    padding-left: 2%;
}
.shinryojikan {
    display: block;
    justify-content: flex-end;
}
.shinryojikan img{
    width: 100%;
}
.shinryojikan p {
    font-size: 1.5rem;
    text-align: right;
}
.box2 {
    background-color: #edf7fb;
    padding-bottom: 100px;
}
.box2 h1 {
    padding: 60px 0 20px;
}
.box2_shinryo {
    width: 100%;
}
.box2_shinryo img{
    width: 100%;
}
.box2_gairai {
  background: rgba(0, 0, 0, .2); /* マスクの色(黒の50%) */
    text-align: center;
position: relative;
}
.gairai_txt {
  background: rgba(0, 0, 0, .2); /* マスクの色(黒の50%) */
    width: 100%;
    font-size: 1.6rem;
    color: #fff;
      position:absolute;
    top:50%;
    left: 50%;
    z-index: 2;
    transform: translate(-50%, -50%);
}
.gairai_photo img{
    width: 100%;
}

.box2_gairai{
  cursor: pointer;
  position: relative;
}

.box2_gairai img {
width: 100%;
}
.box2_gairai::before{
  background: rgba(0, 0, 0, .5); /* マスクの色(黒の50%) */
  bottom: 0;
  content: '';
  height: auto;
  left: 0;
  opacity: 0; /* 最初は透明(非表示) */
  position: absolute;
  right: 0;
  top: 0;
  transition: opacity .6s ease; /* ゆっくりopacityのみへ変化させる */
  width: 100%;
}
.box2_gairai:hover::before {
  opacity: 1; /* hoverしたら透過しない(表示させる) */
}
.box2_gairai p {
  align-items: center; /* テキストの中央揃え */
  color: #fff; /* テキストの色 */
  display: flex; /* テキストの中央揃え */
  justify-content: center; /* テキストの中央揃え */
  margin: auto;
  position: absolute;
    height: 100%;
      transform: translate(-50%, -50%);
}


.box3 {
    padding: 10px 10px 150px;
    display: flex;
    flex-wrap: wrap;/* 折り返し */
    justify-content: space-between;/* 幅いっぱい */
    row-gap: 10px;
}
.box3 a {
flex-basis: calc((100% - 40px) / 5);
}
.btn_nav {
flex-basis: calc((100% - 40px) / 5);
    position: relative;
}
.btn_nav::before {
  content: "";         /* 疑似要素に必須 */
  width: 100%;         /* 幅いっぱい */
  height: 100%;        /* 高さいっぱい */
background:linear-gradient(180deg, transparent 50%, #086593 70%);
  position: absolute;  /*  */
  top: 0;
  left: 0;
}
.box3 .btn_nav img{
  width: 100%;   
    padding: 0;
}
.btn_nav_txt {
width: 180px;
    text-align: center;
    font-size: 2.0rem;
    color: #fff;
    position: absolute;
    left: 50%;
    top: 78%;
    z-index: 2;
    transform: translate(-50%, -50%);
}
.y_btn {
     width: 60px;
  height: 60px;
  padding: 0;
  background: #fff;
    border: 2px solid #086593;
  border-radius: 50%;
    position: absolute;
    left: 50%;
    bottom: -10%;
    z-index: 3;
    transform: translate(-50%, 0%);
    overflow: visible;
}
.arrow2 {
position: relative;
    display: inline-block;
    width: 25px;
    height: 1.5px;
    margin: 27px 15px;
    border-radius: 9999px;
    background-color: #086593;
}

.arrow2::before,
.arrow2::after {
  content: "";
    position: absolute;
    top: calc(50% - 0.5px);
    right: 0;
    width: 10px;
    height: 1.5px;
    border-radius: 9999px;
    background-color: #086593;
    transform-origin: calc(100% - 0px) 50%;
}

.arrow2::before {
  transform: rotate(45deg);
}

.arrow2::after {
  transform: rotate(-45deg);
}

.box4 {
  background: repeating-linear-gradient(-45deg, #fff, #fff 5px, #efefef 5px, #efefef 10px);
    padding-bottom: 80px;
      font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
.box4 h1 {
    padding: 60px 0 70px;
}
.box4_1 {
    width: 1100px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    padding-bottom: 50px;
}
.box4_2_1 , .box4_2_2 {
  position:relative;
}
.box4_2_1 {
    width: 48%;
    padding-top: 50px;
}
.box4_2_2 {
    width: 48%;
}
.box4_2_1_2 {
    display: block;
}

.box4_3 img {
    width: 100%;
}
.box4_3_suji1 img{
  position:absolute;
  height: 60px;
  z-index: 1;
  left: 10px;
  top :20px;
}
.box4_3_suji2 img{
  position:absolute;
  height: 60px;
  z-index: 1;
  left: 10px;
  top :-30px;
}
.box4_3_txt1 {
  position:absolute;
  font-size: 2.8rem;
  font-weight: 500;
  letter-spacing: 1px;
  padding: 10px 20px;
  background-color: #fff;
    left: 0%;
    bottom: 8.5%;
    z-index: 2;
    transform: translate(0%, -50%);
}
.box4_3_txt1_1 {
  position:absolute;
  font-size: 2.8rem;
  font-weight: 500;
  letter-spacing: 1px;
  padding: 10px 20px;
  background-color: #fff;
    left: 0%;
    bottom: 11.5%;
    z-index: 2;
    transform: translate(0%, -50%);
}
.box4_3_txt1_2 {
  position:absolute;
  font-size: 2.8rem;
  font-weight: 500;
  letter-spacing: 1px;
  padding: 10px 20px;
  background-color: #fff;
    left: 0%;
    bottom: 8%;
    z-index: 2;
    transform: translate(0%, -50%);
}
.box4_3_txt2 {
  position:absolute;
  font-size: 2.8rem;
  font-weight: 500;
  letter-spacing: 1px;
  padding: 10px 20px;
  background-color: #fff;
    left: 0%;
    bottom: 23.5%;
    z-index: 2;
    transform: translate(0%, 0%);
}
.box4_3_txt2_1 {
  position:absolute;
  font-size: 2.8rem;
  font-weight: 500;
  letter-spacing: 1px;
  padding: 10px 20px;
  background-color: #fff;
    left: 0%;
    bottom: 15%;
    z-index: 2;
    transform: translate(0%, -50%);
}
.box4_3_txt2_2 {
  position:absolute;
  font-size: 2.8rem;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 10px 20px;
  background-color: #fff;
    left: 0%;
    bottom: 25%;
    z-index: 2;
    transform: translate(0%, -50%);
}
.box4_4 {
    padding-top: 40px;
}
.box4_4_0 {
    padding-top: 50px;
}
.box4_4_1 {
    padding-top: 20px;
    font-size: 1.7rem;
}
.arrow1{
	position: relative;
	display: inline-block;
	padding: 0 30px 0 0;
	color: #000;
	vertical-align: middle;
	text-decoration: none;
	font-size: 15px;
}
.arrow1::before,
.arrow1::after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	content: "";
	vertical-align: middle;
  z-index: 3;
}
.sample1-2::before{
	right: 3px;
	width: 25px;
	height: 2px;
	background: #c7c7c7;
}
.sample1-2::after{
	right: 3px;
	width: 6px;
	height: 6px;
	border-top: 2px solid #c7c7c7;
	border-right: 2px solid #c7c7c7;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

.box4_5 {
    text-align: right;
    padding-top: 10px;
}
.box5 {
    width: 1100px;
    margin: 0 auto;
    padding: 50px 0 100px;
}

.kanren {
  position:relative;
  text-align: center;
}
.kanren_txt {
  padding: 15px 30px;
    background-color: #fff;
  position:absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.35);
}
.kanren_sisetu {
    padding-bottom: 3px;
}
.sisetu_txt {
    padding-bottom: 5px;
    text-align: center;
}
.sisetu_btn .btn{
    color: #fff;
    background-color: #086593;
}
.sisetu_btn .arrow {
    left: 20%;
}
.saiyo_btn .arrow::before, .saiyo_btn .arrow::after  {
    background-color: #fff;
}

.box6 {
    background: url(http://atubetu-jibika.com/wp/wp-content/uploads/2025/08/box_bc6.jpg);
    background-size: cover;
    width: 100%;
}
.saiyou {
    width: 1100px;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}
.saiyo_txt {
    padding: 50px 0px 30px;
    width: calc(100% / 3 - 50px);
}
.saiyo_titl1 {
    font-size: 2.7rem;
    font-weight: 500;
    color: #fff;
    padding-bottom: 20px;
}
.saiyo_titl2 {
    color: #fff;
}
.saiyo_p {
    color: #fff;
    padding-bottom: 20px;
}
.saiyo_btn .btn{
    color: #008c6b;
    background-color: #fff;
}
.saiyo_btn .arrow {
    left: 20%;
}
.saiyo_btn .arrow::before, .saiyo_btn .arrow::after  {
    background-color: #008c6b;
}
.saiyo_photo {
    padding: 40px 0;
    width: calc((100% / 3) * 2 - 50px);
    display: block;
    justify-content: flex-end;
}
.saiyo_photo img {
    width: 100%;
}


@media screen and (max-width: 1024px) {
.news-content p{
  width: 200px;
}
.news_jikan {
    width: 90%;
}

.news-row_wrapper {
    padding: 10px 5px;
}
.box4_1 {
    width: 100%;
    padding: 0 30px 50px;
}
.box4_3_txt1 {
  font-size: 2.0rem;
        width: auto;
        left: 0%;
        bottom: 10%;
  transform: translate(0%, -50%);
}
.box4_3_txt2 {
  font-size: 2.0rem;
        width: auto;
        left: 0%;
        bottom: 20%;
  transform: translate(0%, -50%);
}
.box4_3_txt1_1 {
  font-size: 2.0rem;
        width: auto;
        left: 0%;
        bottom: 15%;
        transform: translate(0%, -50%);
}
.box4_3_txt2_1 {
    font-size: 2.0rem;
  width: auto;
    left: 0%;
    bottom: 22%;
    z-index: 2;
    transform: translate(0%, -50%);
}
.box4_3_txt1_2 {
    font-size: 2.0rem;
        width: auto;
    left: 0%;
    bottom: 10%;
    z-index: 2;
    transform: translate(0%, -50%);
}
.box4_3_txt2_2 {
    font-size: 2.0rem;
        width: auto;
    left: 0%;
    bottom: 20%;
    z-index: 2;
    transform: translate(0%, -50%);
}
.box5 {
    width: 100%;
    padding: 50px 0 100px;
}
.saiyou {
    width: 100%;
    padding: 0 30px;
}
.y_btn {
     width: 50px;
  height: 50px;
}
.arrow2 {
    width: 20px;
    margin: 23px 14px;
}
}
@media screen and (max-width: 820px) {
.top_gaikan .photo img {
    width: 100%;
    padding-bottom: 200px;
}
.ishihyou_machijyokyo {
    top: 15%;
}
.top_gaikan .txt {
    position: absolute;
    top: 50px;
    left: 5%;
    z-index: 1;
}
.news_jikan {
        width: 90%;
        padding: 10px 20px;
        display: block;
        left: 50%;
        bottom: 5%;
    }
.news-content p{
  width: 130px;
}

.shinryou {
    display: flex;
    width: 100%;
    padding: 0 30px 10px;
}
.news_jikan {
    width: 90%;
    padding: 10px 20px;
    display: flex;
    left: 50%;
    bottom: 5%;
}
.news-classification {
    display: flex;
}

.gairai_txt1 {
    bottom: 10%;
}
.box3 .btn_nav_txt {
        width: 130px;
    font-size: 1.8rem;
}
.box4_3_txt1 {
    padding: 10px;
  bottom: 15%;
}
.box4_3_txt2 {
    padding: 10px;
  bottom: 25%;
}
.box4_3_txt1_1 {
    padding: 10px;
        bottom:18%;
}
.box4_3_txt2_1 {
    padding: 10px;
    bottom: 24%;
}
.box4_3_txt1_2 {
    padding: 10px;
    bottom: 16%;
}
.box4_3_txt2_2 {
    padding: 10px;
    bottom: 26%;
}
.y_btn {
     width: 35px;
  height: 35px;
}
.arrow2 {
        width: 15px;
        margin: 15px 8px;
}
.arrow2::before, .arrow2::after {
    top: calc(50% - 1px);
    width: 7px;
}
}
@media screen and (max-width:768px) {
    
.ishihyou_machijyokyo {
    top: 0%;
}
    .top_gaikan .gaikan_photo img {
            height: 720px;
    padding-bottom: 410px;
    object-position: 50% 90%;
}
    .news_titl {
    justify-content: space-between;
}
.top_gaikan .txt{
    top : 20px;
    left: 10%;
}
    .top_gaikan .txt img {
        width: 120px;
    }
    .shinryou {
        display: block;
    }
.shinryojikan p {
    font-size: 1.15rem;
}
.box2_gairai p {
    top: 100%;
}
.gairai_txt {
    font-size: 1.3rem;
        bottom: 0%;
    }
    .gairai_txt1 {
        bottom: 27%;
    }
    .box2_shinryo {
    padding-bottom: 10px;
        width: 100%;
        margin: 0 auto;
}
.news_jikan .dai_txt2 {
    font-size: 2.5rem !important;
}
.news_jikan .shinryo_time .dai_txt2 {
       text-align: center;
    }
    
.information, .update, .important {
    width: 55px;
    font-size: 1.0rem;
}
    .news-date {
    font-size: 1.1rem;
    margin-right: 10px;
}
    .news-content {
    font-size: 1.1rem;
        
    }

    .news_jikan {
        display: block;
    }
    .top_gaikan .photo img {
        padding-bottom: 540px;
    }
    .news-content p {
        max-width: 150px;
        width: 100%;
    }
.news {
    width: 100%;
    padding-right: 0%;
}
.box2 {
    padding-bottom: 40px;
}
.box2_gairai {
    width: 100%;
    display: block;
}
.box2_gairai1 {
    width: calc(100% / 1 - 0px);
    margin: 0 auto;
    text-align: center;
position: relative;
}
.top_jikan {
    width: 100%;
    padding-left: 0%;
}
.box3 {
    padding: 0px 0px 0px;
width: 90%;
    margin: 50px auto;
}
.box3 a {
            flex-basis: auto;
      width: calc(100% / 2 - 10px);
}
.btn_nav {
flex-basis: calc((100% - 0px) / 2);
            margin-bottom: 20px;
}
.y_btn {
    width: 40px;
    height: 40px;
}
.arrow2 {
    margin: 18px 11px;
}
.box4 {
    padding-bottom: 40px;
}
    .box4 .shita_50 {
    margin-bottom: 0px !important;
    }
.box4 h1 {
    padding: 60px 0 30px;
}
.box4_1 {
    width: 100%;
    padding: 0 30px;
    display: block;
    padding-bottom: 0px;
}
.box4_2_1 {
    width: 100%;
    padding-top: 50px;
}
.box4_2_2 {
    width: 100%;
    padding-top: 50px;
}
.box4_3_suji1 img {
    height: 40px;
    top: 30px;
}
.box4_3_suji2 img {
    height: 40px;
    top: 30px;
}
.box4_3_txt1 {
    font-size: 1.8rem;
  width: auto;
        bottom: 10%;
    padding: 10px;
}
.box4_3_txt2 {
    font-size: 1.8rem;
  width: auto;
        bottom: 10%;
    padding: 10px;
}
.box4_3_txt1_1 {
    font-size: 1.8rem;
  width: auto;
        bottom:18%;
        padding: 10px;
}
.box4_3_txt2_1 {
    font-size: 1.8rem;
  width: auto;
    bottom: 14%;
        padding: 10px;
}
.box4_3_txt1_2 {
    font-size: 1.8rem;
  width: auto;
    bottom: 15%;
        padding: 10px;
}
.box4_3_txt2_2 {
    font-size: 1.8rem;
  width: auto;
    bottom: 14%;
        padding: 10px;
}
.box4_4 {
    padding-top: 40px;
    font-size: 1.5rem;
}
.box4_4_1 {
    padding-top: 30px;
    font-size: 1.5rem;
}
.box5 {
    width: 100%;
    padding: 20px 0 60px;
}
.box5 .tyu_txt {
    font-size: 1.0rem!important;
    text-align: center;
}
.box5 img{
    width: 100%;
    padding: 0 30px;
}
.kanren_txt {
    padding: 10px 15px;
    transform: translate(-50%, -50%);
    width: 55%;
}
.box6 {
    background-position : center;
}
.saiyou {
    width: 100%;
    padding: 0 30px;
    display: block;
}
.saiyo_txt {
    padding: 50px 0px 30px;
    width: calc(100% / 2 - 10px);
}
.saiyo_titl1 {
    font-size: 2.5rem;
    padding-bottom: 10px;
}
.saiyo_photo {
    padding: 20px 0;
    width: calc((100% / 2)* 1 - 10px);
}
    .saiyo_txt .tyu_txt {
    font-size: 1.2rem !important;
}
    .box6 .flex_box_b {
        align-items: center;
    }
}

@media screen and (max-width:480px) {
.top_gaikan .txt{
    top : 160px;
    left: 10%;
}
    .top_gaikan .txt img {
        width: 230px;
    }
    .footer_nav {
        display: none;
    }
}
@media screen and (max-width:375px) {
    .box4_3_txt1 {
        bottom: 15%;
    }
    .box4_3_txt2 {
        bottom: 15%;
    }
}









/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
  .pc { display: none !important; }
  .sp { display: block !important; }
}