/* CSS Document */
img{
    width: 100%;
    height: auto;
}
.double-border {
  position: relative;
max-width: 1366px;
  min-height: 100px;
  background: #fff;
  box-sizing: border-box;
    margin:0 auto 90px;
}

/* 外側の黒線 */
.double-border::before,
.double-border::after {
  content: "";
  position: absolute;
  top: 0;
  width: 36px; /* 外＋内の合計幅 */
  height: 100%;
  background: linear-gradient(
    to right,
    #bc771a 0 18px,  /* 外側5px黒 */
    #052982 18px 36px /* 内側5px灰 */
  );
}

.double-border::before {
  left: 0;
}

.double-border::after {
  right: 0;
  transform: scaleX(-1); /* 右側は反転して対称に */
}

.pcm{
	display: block;
}
.sph{
	display: none;
}



/* 基本設定（やや速め） */
.sa {
  opacity: 0;
  transition: all .4s ease-out; /* ←自然に減速して止まる */
}

/* ゆっくり出るタイプ */
.sa--slow {
  transition: all 2.5s ease-out; /* ←ゆっくり、やわらかく出る */
}

/* 位置アニメーション */
.sa--sty {
  transform: translate(0, 0px);
}
.sa--lr {
  transform: translate(-60px, 0);
}
.sa--rl {
  transform: translate(100px, 0);
}

.sa--up {
  transform: translate(0, 40px);
}
.sa--down {
  transform: translate(0, -100px);
}

/* 表示状態 */
.sa.show {
  opacity: 1;
  transform: none;
}

/* 既存の .sa, .sa.show はそのままでOK */

@keyframes saBlink {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.2;          /* ←より薄く（前は0.6） */
    transform: scale(1.01); /* ←膨らみを1.01に抑える（揺れ防止） */
  }
}

/* スクロール後に点滅 */
.sa.blinking.show {
  animation: saBlink 3.5s ease-in-out infinite;
}

/* 常時点滅専用 */
.blinking {
  animation: saBlink 3.5s ease-in-out infinite;
}



.bg_box{
    max-width: 1290px;
width: 90%;
    margin: 0 auto;
    min-height: 900px;
    background: url("../image/2x/bg_cream.jpg") no-repeat top center;
    background-size: cover;position: relative;
}
.top_left_logo{
	max-width: 130px;
	top: 40px;
	left: 40px;position: absolute;
}
.nomal_flex{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.item_001{
padding: 0 0 0 20px;
	max-width: 1046px;
	width: 95%;
	margin: 0 auto;
}

.moji_test{
    width: 400px;
    margin: 700px auto 0px;
    padding-bottom: 620px;
}

#main_logo {
	max-width: 600px;
	width: 60%;
	margin: 0 auto 0;padding: 80px 0px 0 0px;
}

.loca_txt{
	max-width: 440px;
	width: 55%;padding: 80px 0px 0 0px;margin: 0 auto;
}

.cir_bt_box{
	padding: 30px 0px 120px 0px;
	margin: 0 auto ;
	max-width: 580px;
	width: 70%;
}

.flex_30{
	width: 31%;
}

#concept_sec{
	background: url("../image/2x/y_bg@2x-80.webp") no-repeat center top;
	background-size: cover;
	padding: 100px 0;
}
#qu_sec{
	background: url("../image/2x/qu.jpg") no-repeat center bottom;
	background-size: cover;
	padding: 100px 0;
}
#cas_sec{
	background: url("../image/2x/cas_bg@2x-80.jpg") no-repeat center top;
	background-size: cover;
	padding: 100px 0;
}
#an_sec{
	background: url("../image/2x/an_bg.webp") no-repeat center top;
	background-size: cover;
	padding: 100px 0;
}
#loca_sec{

	padding: 100px 0;
}
#kaihatsu_sec{
	background: url("../image/2x/kaihatsu_bg.webp") no-repeat center top;
	background-size: cover;
	padding: 60px 0;
}
#loca_ab_sec{
	background: url("../image/2x/loca_ab_bg.jpg") no-repeat center top;
	background-size: cover;
	padding: 100px 0;
}
#magaz_sec{
	
	padding: 100px 0;
}


.con_txt{
	max-width: 546px;
	width: 70%;
	margin: 0 auto;
	padding:0 0px 80px 0px;
}

.con_ti{
	max-width: 190px;
	width: 70%;
	margin: 0 auto;
	padding:0 0px 80px 0px;
	
}
.con_ti2 {
    max-width: 190px;
    width: 70%;
    margin: 0 auto;
    padding: 0 0px 0px 0px;
}
.con_ti3 {
    max-width: 256px;
    width: 70%;
    margin: 0 auto;
    padding: 0 0px 60px 0px;
}
.con_item{
	max-width: 1046px;
	width: 85%;
	margin: 0 auto;
	padding:0 63px 80px 63px;
	
}
.loc_co1{
	max-width: 790px;
	width: 70%;
	margin: 0 auto;
	padding:0 0px 0px 0px;
	
}
.loc_co2 {
    max-width: 790px;
    width: 70%;
    margin: 0 auto;
    padding: 0 0px 0px 0px;
    background: url(../image/2x/loca_pc_002_bg.webp) no-repeat top center;
    background-size: cover;
}
.qua_box{
	max-width: 1046px;
	width: 85%;
	margin: 0 auto;
}
.flex_50{
	width: 50%;
}

.qua_txt{
padding-top: 110px;
padding-bottom: 70px;
	
}

.kaihatsu_co1{
	max-width: 528px;
	width: 70%;
	margin: 0 auto;
	padding:0 0px 60px 0px;
	
}
.loca_ab_txt{
	max-width: 600px;
	margin: 0 auto;
	width: 70%;
}
.pb_30{
	padding-bottom: 30px;
}

.magaz_txt {
    max-width: 600px;
    margin: 0 auto;
    width: 70%;
	padding: 0 0 120px 0;
}
.magaz_bt{
	max-width: 740px;
	margin: 0 auto;
}
.flex_48{
	width: 48%;
}

.top_cat_txt {
    max-width: 345px;
    position: absolute;
    bottom: 70px;
    right: 10%;
    margin: 0;
}
ul.sns {
    margin: 60px 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
    
 ul.sns li {
    margin: 0 8px;
}
@media screen and (max-width: 590px) {
	.pcm{
	display: none;
}
.sph{
	display: block;
}
    
.sa--lr {
  transform: translate(-30px, 0);
}
.sa--rl {
  transform: translate(30px, 0);
}
    
    
    
    .qua_sp_img{
        padding-bottom: 30px;
    }
#qu_sec {
    background: none;
    background-size: cover;
    padding: 50px 0 0 0;
}
    #main_logo {
        width: 75%;
        margin: 0 auto 0;
        padding: 30px 0px 0 0px;
    }
    .qua_sp_txt{
        width: 80%;
        margin: 0 auto 40px;
    }
    
.top_cat_txt {
    max-width: 345px;
    position: absolute;
    bottom: 20px;
    right: 0;
 
    width: 80%;
    left: 0;
    margin: 0 auto;
}
    
    
#loca_sec {
    padding: 10px 0 60px 0;
}
    #kaihatsu_sec {
    background: none;
    
    padding: 0 0 0px 0;
}
.loc_co1 {
    max-width: 790px;
    width: 80%;
    margin: 0 auto;
    padding: 0 0px 25px 0px;
}
.kaihatsu_co1 {
    max-width: 528px;
    width: 80%;
    margin: 0 auto;
    padding: 0 0px 0px 0px;
}
#loca_ab_sec {
    background: url(../image/2x/loca_ab_bg.jpg) no-repeat center top;
    background-size: cover;
    padding: 50px 0;
}
.bg_box {
    
    width: 98%;
    margin: 0 auto;
    min-height: 900px;
    background: url("../image/2x/top_bg_sp@2x-80.jpg") no-repeat top center;
    background-size:cover;
    position: relative;
    z-index: 0;
}
	
.double-border::before,
.double-border::after {
  content: "";
  position: absolute;
	z-index: 1;
  top: 0;
  width: 14px; /* 外＋内の合計幅 */
  height: 100%;
  background: linear-gradient(
    to right,
    #bc771a 0 7px,  /* 外側5px黒 */
    #052982 7px 14px /* 内側5px灰 */
  );
}
	
.top_left_logo {
    max-width: 60px;
    top: 0px;
    left: 30px;
    position: absolute;
}
	
    .item_sp {
        max-width: 225px;
        margin: 0 auto 0 22%;
    }
	.loca_txt {
    max-width: 440px;
    width: 80%;
    padding: 0px 0px 0 0px;
    margin: 0 auto;
}
.cir_bt_box {
    padding: 30px 0px 60px 0px;
    margin: 0 auto;
    max-width: 580px;
    width: 80%;
}
#concept_sec {
    background: url(../image/2x/y_bg@2x-80.webp) no-repeat center top;
    background-size: cover;
    padding: 50px 0;margin-top: 1px;
}
.con_ti {
    max-width: 170px;
    width: 70%;
    margin: 0 auto;
    padding: 0 0px 30px 0px;
}
.con_txt {
    max-width: 546px;
    width: 80%;
    margin: 0 auto;
    padding: 0 0px 40px 0px;
}
.con_item {
    max-width: 1046px;
    width: 80%;
    margin: 0 auto;
    padding: 0 0px 0px 0px;
}
	
.loc_co2 {
    
    width: 80%;
    margin: 0 auto;
    padding: 0 0px 0px 0px;
    background: url("../image/2x/loca_sp_002bg.png") no-repeat top center;
    background-size: cover;
}
	
.con_ti2 {
    max-width: 160px;
    width: 70%;
    margin: 0 auto;
    padding: 0 0px 25px 0px;
}
.loca_ab_txt {
    max-width: 600px;
    margin: 0 auto;
    width: 80%;
}
#magaz_sec {
    padding: 50px 0;
}
.con_ti3 {
    max-width: 200px;
    width: 70%;
    margin: 0 auto;
    padding: 0 0px 30px 0px;
}
.magaz_txt {
    max-width: 600px;
    margin: 0 auto;
    width: 80%;
    padding: 0 0 50px 0;
}
.magaz_bt {
    max-width: 740px;
    margin: 0 auto;
    width: 80%;
}
    
.flex_48 {
    width: 100%;
    margin-bottom: 20px;
}

	
	
}