/* 1536 , 1530 × 735 ,1366 *//* 上記画面幅でも崩れていないか確認 */

/* 修正した場合→各項目の一番下に日付をコメントアウトして追記 */

/*
#loading{
    display:none;
}
*/

@charset "utf-8";
/*■■　ALL　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#loading img{
    max-width:200px;
}
.top_cms_wrap .top_cms_before,
.footer_back .f_before,
.all main.scrollin .all_bg{
    display:none;
}
header,
.top_cms_wrap::before{
    background: linear-gradient(180deg, var(--color1), var(--color3));

}
/*ボタン角丸*/
header .contact_bt a, header .tel_bt a,
.more a, footer .foot_tel_bt a,
.cate_list li a,
#page10 ul li a,
.banner{
    border-radius: 50px;
}
footer .logo img{
    max-width:120px;
}
footer .link_box li {
    max-width: 25px;
}
/* PC用のロゴサイズ調整 */
#logo img.tb_hide {
    width: 80% !important; /* 50%から80%へ拡大（お好みで調整してください） */
    max-width: 300px;      /* 親要素の制限に合わせて最大幅を設定 */
}



/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
.head_box{
    margin-left: 0;
    padding-left: 0;
}
#logo img{
    width:100%!important;
}
.link_box li:last-of-type{
    margin-right:0!important;
}
#loading img{
    max-width:200px;
}
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
.banner{
    font-size:20px;
}
.hamburger {
    top: 18px;
}
#loading img{
    max-width:150px;
}
}



/*■■　FV　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#main_img{
    width:calc(100% - 5vw);
}
.catchcopy {
    bottom: 10%;
    left: 5%;
    width: 37vw;
    max-width: 1200px;
    z-index: 2;
}
.catchcopy img {
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.15));
}

.loop-slider {
  overflow: hidden;
  width: 100%;
}

.loop-slider__track {
  display: flex;
  width: max-content;
}

.loop-slider__track li {
  flex-shrink: 0;
  width: 80vw;
}

.loop-slider__track img {
  width: 100vw;      /* 1枚＝画面幅 */
  height: 100%;
  object-fit: cover;
  object-position: center; /* 念のため */
  pointer-events: none;
  user-select: none;
}

/*画像に余白つける*/
.loop-slider {
  overflow: hidden;
}

.loop-slider__track {
  display: flex;
}

.loop-slider__track li {
  flex-shrink: 0;
  padding: 40px 20px;   /* ← ここが余白 */
  box-sizing: border-box;
}

.loop-slider__track img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}




/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
#main_img{
    width:100%;
}
.catchcopy{
    bottom:20%;
    width:55vw;
}
.loop-slider__track li{
    padding:50px 25px;
    min-height:60vh;    
}
#contents1 .title {
    font-size: 33px;
}
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
#main_img{
    min-height:45vh;
}
.catchcopy{
    bottom:20%;
    width:85vw;
}
.loop-slider__track li{
    width:100vw;
    padding:30px 15px;
}
}



/*■■　TOP　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.contents1_wrap {
    background: url(/Files/img/item2.png) no-repeat top 12% right 0% / 150px;
}
/*text grad*/
#contents1 .title,
#page_title h2{
    background: linear-gradient(90deg, var(--color1),var(--color3));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
#contents1 .title:before{
    display:none;
}

/*背景ループ*/
.top_cms_wrap{
    position:relative;
}
.top_cms_wrap::before {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	width: 100%;
	height: 50px;

	background-image:
		url("/Files/img/item1.png"),
		linear-gradient(to left, var(--color3), var(--color1));

	background-size:
		auto 100%,
		100% 100%;

	background-position:
		0 0,
		0 0;

	background-repeat:
		repeat-x,
		no-repeat;

	opacity: 0.8;

	animation: loop 30s linear infinite;
}

@keyframes loop {
	from {
		background-position: 0 0, 0 0;
	}
	to {
		background-position: 1000px 0, 0 0;
	}
}

#top_cms .con_box{
    background-color:transparent!important;
}
.top_cms_wrap {
    background: url(/Files/img/item2.png) no-repeat top 60px left / 250px;
}

/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
.contents1_wrap{
    background: url(/Files/img/item2.png) no-repeat top right / 130px;
}
#contents1 .title{
    letter-spacing:-2px;
}
.top_cms_wrap {
    background: url(/Files/img/item2.png) no-repeat top 60px left / 150px;
}
.top_cms_wrap::before{
    height:40px;
}
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){
#contents1 .title {
    font-size: 30px;
}
#contents2 .title, #contents3 .title{
    font-size:24px;
}
.top_cms_wrap::before{
    height:30px;
}
}



/*■■　下層ページ　■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/


/* ---------------------------　タブレット　-------------------------- */
@media screen and (max-width: 768px){
#page10{
    padding: 20px;
}
}

/* --------------------------　スマホ　-------------------------- */
@media screen and (max-width: 667px){

}