/*
 Theme Name:   habakiri Child
 Description:  habakiri Child Theme
 Template:     habakiri
 Text Domain:  habakiri-child
*/
body {
	font-family: "fot-tsukuaoldmin-pr6n", sans-serif;
font-weight: 300;
font-style: normal;
}

#container {
	height:100vh;
	overflow:visible !important;
}

.head {
	width:100%;
	height:100vh;
	position:relative;
}

.head2 {
	width:100%;
	height:30vh;
	position:relative;
	background:url(/wp-content/uploads/2025/12/S__41197596_0.jpg) no-repeat;
	background-size:cover;
}

.h_logo {
	position:absolute;
	top:80px;
	left:5%;
	width:350px;
}

.logo_txt {
	position:absolute;
	top:150px;
	left:6%;
	color:#fff;
	font-size:16pt;
	font-family: 
  "Hiragino Kaku Gothic ProN",
  "Hiragino Sans",
  "Yu Gothic",
  "Meiryo",
  sans-serif;
font-weight: 700;
}
.h_menu {
	position:absolute;
	top:100px;
	right:5%;
	text-align:right;
}

.head-nav {
  display: flex;
  gap: 30px; /* 項目間の余白（調整OK） */
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center; /* 高さ位置を中央に揃えたい場合 */
}

.head-nav li {
  margin: 0;
  padding: 0;
}

.head-nav a {
  text-decoration: none;
  display: block;
  padding: 8px 0; /* 高さの余白、調整OK */
	color:#fff;
}



.sub-page-contents {
	width:100%;
	position:relative;
	padding-top:0px !important;
}
.container {
	width:100%;
}
section {
	width:100%;
	padding:10%;
	position:relative;
}

.s_txt {
	position:relative;
	background-color:rgba(255,255,255,0.9);
	padding:7%;
	width:70%;
	z-index:9999;
	margin-top:250px;
}



.s_txt span {
	margin:20px 0px;
	display:block;
}

.columns {
  display: flex;
  gap: 20px;
	margin-top:50px;
}

.box {
  flex: 1;
	background-color:rgba(255,255,255,0.7);
	padding:30px;
}

.s_txt2 {
	position:relative;
	background-color:rgba(255,255,255,0.9);
	padding:7%;
	width:60%;
	z-index:9999;
	margin-top:100px;
}



.s_txt2 span {
	margin:20px 0px;
	display:block;
}

.sr_txt {
	position:absolute;
	padding:7%;
	width:45%;
	z-index:9999;
	bottom:20px;
	right:20px;
}

.sr_txt span {
	margin:20px 0px;
	display:block;
	color:#fff;
}

.r_image {
	position:absolute;
	width:50%;
	right:0;
	top:50px;
}
.sec_title {
	color:#fff;
	position:absolute;
	top:50px;
}

.about {
	color:#fff;
}

.about .th {
	text-align:right;
	padding:10px 20px;
}

.bc_3 {
	background-color:#333333;
}

.bc_4d {
	background-color:#4d4d4d;
}


.bc_00 {
	background-color:#000000;
}

.bc_99 {
	background-color:#999;
}

.bc_img {
	background:#000;
	background-size:cover;
  background-attachment: fixed; /* ← これが固定 */
}


.site-header {
  display: flex;
  align-items: center;    /* 垂直中央揃え */
  gap: 20px;              /* 左右の余白 */
  padding: 16px 24px;
	color:#fff;
	margin:25px 0px;
}

/* 左右を等分 */
.site-header .left,
.site-header .right {
  flex: 1 1 0;            /* 同じ比率で伸縮 */
}

.left img {
	 display: block; 
}

.name {
	font-size:16pt;
	margin:10px 0px;
}


.f_logo {
	width:350px;
	position:absolute;
	top:50px;
	left:50px;
}

.f_txt {
	position:absolute;
	left:50px;
	bottom:50px;
	color:#fff;
}

.f_menu {
	position:absolute;
	top:50px;
	right:50px;
}

.pc { display: block !important; }
.sp { display: none !important; }

.partner-carousel {
  overflow: hidden;
  width: 100%;
	margin-top:100px;
}

.partner-track {
  display: flex;
  align-items: center;
  gap: 48px;
  will-change: transform;
}

/* aタグをブロック化して幅を固定 */
.partner-track a {
  display: inline-flex;        /* ←重要 */
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;              /* 勝手に伸びない */
}

/* imgはサイズだけ管理 */
.partner-track a img {
  height: 80px;
  width: auto;
  max-width: none;             /* ←WPテーマ対策 */
  display: block;
}

.jviglogo {
	position:absolute; 
	z-index:9999; 
	bottom: 40px; 
	right: 40px; 
	color:#fff; 
	text-align:center; 
	font-size:20pt; 
	width:300px;
	font-family: 
  "Hiragino Kaku Gothic ProN",
  "Hiragino Sans",
  "Yu Gothic",
  "Meiryo",
  sans-serif;
font-weight: 700;
}

.ccohrd_logo {
	position:absolute;
	z-index:9999;
	top:200px;
	left:80px;
	width:200px;
}

.more_bottun {
	width:300px;
	padding:25px 50px;
	border:1px solid #fff;
	margin:0 auto;
	color:#fff;
	text-align:center;
	font-size:14pt;
}
.accordion-title {
  width: 100%;
  text-align: center;
  padding: 12px;
  background: #999;
  border: none;
  cursor: pointer;
  font-weight: bold;
}

.accordion-content {
  overflow: hidden;
  max-height: 0;
  transition: 0.3s ease;
  background: #333;
  padding: 0 12px;
}

.row {
	background:#4d4d4d;
}

.banner {
	  display: flex;
  gap: 20px; /* DIV間の余白 */
	width:70%;
	margin:0 auto;
}

.form_banner {
	  width: 50%;
  border:1px solid #fff;
  padding: 20px;
background-color: rgba(0, 0, 0, 0.6);
	color:#fff;
	text-align:center;
	height:80px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.form_banner a {
	color:#fff;
}

@media only screen and (max-width: 765px) {
.pc { display: none !important; }
.sp { display: block !important; }
	
	body {
		font-size:12px;
	}	
	#container {
	height:100%;
	overflow:visible !important;
}

.head {
	width:100%;
	height:100%;
	position:relative;
}

.h_logo {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:200px;
}
	
	.logo_txt {
	position:absolute;
	top:60%;
	left:50%;
	transform:translatex(-50%);
	color:#fff;
	font-size:12pt;
}
	
.h_menu {
	position:absolute;
	top:100px;
	right:5%;
	text-align:right;
}
	


.head-nav {
  display: flex;
  gap: 30px; /* 項目間の余白（調整OK） */
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center; /* 高さ位置を中央に揃えたい場合 */
}

.head-nav li {
  margin: 0;
  padding: 0;
}

.head-nav a {
  text-decoration: none;
  display: block;
  padding: 8px 0; /* 高さの余白、調整OK */
	color:#fff;
}



.sub-page-contents {
	width:100%;
	position:relative;
	padding-top:0px !important;
}
.container {
	width:100%;
}
section {
	width:100%;
	padding:5%;
	position:relative;
}

.s_txt {
	position:relative;
	background-color:rgba(255,255,255,0.9);
	padding:7%;
	width:100%;
	z-index:9999;
	margin-top:100px;
	}



.s_txt span {
	margin:20px 0px;
	display:block;
}

.s_txt2 {
	position:relative;
	background-color:rgba(255,255,255,0.9);
	padding:7%;
	width:100%;
	z-index:9999;
	margin-top:100px;
}



.s_txt2 span {
	margin:20px 0px;
	display:block;
}

.sr_txt {
	position:relative;
	padding:5%;
	width:100%;
	z-index:9999;
}

.sr_txt span {
	margin:20px 0px;
	display:block;
	color:#fff;
}

.r_image {
	position:relative;
	width:100%;
	margin-top:20px;
}
.sec_title {
	color:#fff;
	position:relative;
	top:50px;
}

.bc_3 {
	background-color:#333333;
}

.bc_4d {
	background-color:#4d4d4d;
}


.bc_00 {
	background-color:#000000;
}

.bc_99 {
	background-color:#999;
}

.bc_img {
	background:url(/wp-content/uploads/2026/01/LINE_ALBUM_ディーコード写真素材_260124_4.jpg);
	background-size:cover;
  background-attachment: fixed; /* ← これが固定 */
}


.site-header {
  display: flex;
  flex-direction: column; /* ★ 横 → 縦に変更 */
  align-items: center;    /* 中央揃え */
  gap: 20px;
  padding: 16px 24px;
  color: #fff;
  margin: 50px 0;
}

/* 縦並び化に伴い flex幅指定は不要なのでリセット */
.site-header .left,
.site-header .right {
  flex: none;
  width: 100%;            /* 横幅いっぱいに必要なら */
  text-align: left;     /* 中央寄せ */
}

.left img {
	 display: block; 
}

.name {
	font-size:16pt;
	margin:10px 0px;
}


.f_logo {
	width:250px;
	position:static;
	margin:0 auto;
}

.f_txt {
	position:static;
	color:#fff;
	margin:20px auto;
}

.f_menu {
	position:relative;
	top:50px;
	right:50px;
}
	
.jviglogo {
	position:absolute; 
	z-index:9999; 
	bottom: 10px; 
	right: 10px; 
	color:#fff; 
	text-align:center; 
	font-size:12pt; 
	width:100px;
}
	
.ccohrd_logo {
	position:absolute;
	z-index:9999;
	top:auto;
	bottom:20px;
	left:50%;
	transform:translatex(-50%);
	width:120px;
}
	
	  .banner {
    flex-direction: column;   /* 縦並び */
    width: 100%;              /* スマホ幅いっぱい */
    gap: 10px;                /* 余白は少し縮める */
  }

  .form_banner {
    width: 100%;              /* 横幅100% */
  }
	
.about {
	color:#fff;
	margin-top:100px !important;
}
	
	  .columns {
    flex-direction: column; /* 縦並び */
  }

  .box {
    width: 100%;
  }

}

/* フォーム全体のスタイル */
.wpcf7-form {
background-color: #4d4d4d;
padding: 30px;
color:#fff;
}

label {
	display:block !important;
	margin:0 auto;
	width:60%;
}

/* 入力フィールドのスタイル */
.wpcf7-form .form-group label {
display: block;
margin-bottom: 8px;
font-weight: bold;
font-family: 'Georgia', serif;
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form textarea,
.wpcf7-form input[type="file"] {
width: 100%;
padding: 15px;
border: 1px solid #ddd;
border-radius: 8px;
margin-bottom: 15px;
font-family: 'Georgia', serif;
font-size: 16px;
	color:#000;
}

/* フォーカス時のスタイル */
.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form textarea:focus,
.wpcf7-form input[type="file"]:focus {
border-color: #999;
box-shadow: 0 0 5px rgba(0,0,0,0.1);
}

/* 送信ボタンのスタイル */
.wpcf7-form input[type="submit"] {
background-color: #6A5ACD;
color: #FFFFFF;
font-family: 'Times New Roman', serif;
font-size: 18px;
padding: 10px 30px;
border-radius: 5px;
border: 2px solid #483D8B;
transition: background-color 0.3s ease;
	margin:0 auto;
	display:block;
}

.wpcf7-form input[type="submit"]:hover {
background-color: #483D8B;
}

.form_title{
	color:#fff;
	text-align:center;
	padding-top:50px;
}

.form_txt {
	color:#fff;
	text-align:center;	
}