@charset "UTF-8";

/*
	Theme Name: kobayashi-dw
	Theme URI: http://kobayashi-dw.com
	Author: kobayashi-dw
	Author URI: http://kobayashi-dw.com
*/

/****************************************

          General Setting

*****************************************/
/* 全画面スライド */
.new_movie {
	width: 100%;
	height: 73vh;
	margin: 0;
	margin-bottom: -20px;
	position: relative;
	overflow: hidden;
	z-index: 0;
	top: -20px; 
}

/* 背景画像 */
.new_movie .bgImg {
  position: absolute;  /* fixed → absolute に変更 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background-size: cover;
  background-position: center bottom;
  background-repeat: no-repeat;
  animation: bgAnime 24s infinite;
  z-index: 0;
	background: #ffe400;
	background-size: cover;
}

.new_movie .src1 { background-image: url("http://kintaro-t.com/wp-content/uploads/2026/06/index_slide01.jpg"); animation-delay: 0s; }
.new_movie .src2 { background-image: url("http://kintaro-t.com/wp-content/uploads/2026/06/index_slide02.jpg"); animation-delay: 8s; }
.new_movie .src3 { background-image: url("http://kintaro-t.com/wp-content/uploads/2026/06/index_slide03.jpg"); animation-delay: 16s; }

@keyframes bgAnime {
  0%, 100% { opacity: 0; transform: scale(1); }
  4.16% { opacity: 1; }
  33.33% { opacity: 1; }
  41.66% { opacity: 0; transform: scale(1.12); }
}

.new_movie::after {
	padding: 0px;
	margin: 0px;
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(255,255,255,0.2);
	background-image: radial-gradient(#000 0%, transparent 15%), radial-gradient(#000 0%, transparent 15%);
	background-size: 4px 4px;
	background-position: 0 0, 2px 2px;
}

/* --- ロゴや文字 --- */
.new_movie p {
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 700px;
  color: #fff;   /* 文字色を白に */
  z-index: 1;
  line-height: 220%;
  letter-spacing: 0.5em;
}

.new_movie img {
  width: 100%;
  display: block;
}

#index_contents_bbox01 {
	width: calc(100%  - 0px);
	height: 100%;
	margin: 0px;
	padding: 20px 0px;
	background: #fff;
}

#index_slide_img01 {
	float: left;
	width: 100%;
	margin: 0px;
	padding: 0px;
	text-align: center;
}

.index_bbox01 {
	float: left;
	width: 100%;
	margin: 0px;
	padding: 0px;
	background: #ffd800;
}

.index_bbox02 {
	float: left;
	width: 100%;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	padding: 80px 0px;
	color: #fff;
	background: #17288b;
}

.index_bbox02 a {
	color: #fff;
}

.index_bbox02 a:hover {
	color: #ff5f82;
}

.index_service_bbox01 {
	float: left;
	width: 100%;
	margin: 0px;
	padding: 0px;
	background: #ffd800;
}

.index_service_bbox02 {
	float: left;
	width: 100%;
	margin: 0px;
	padding: 0px;
	background: #fff;
}

ul.index_4column {
	float: left;
	width: calc(100% - 0px);
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	padding: 0px;
	font-size: 14px;
	color: #555;
	display:-webkit-box;
	display:-moz-box;
	display:-ms-flexbox;
	display:-webkit-flex;
	display:-moz-flex;
	display:flex;
	-webkit-box-lines:multiple;
	-moz-box-lines:multiple;
	-webkit-flex-wrap:wrap;
	-moz-flex-wrap:wrap;
	-ms-flex-wrap:wrap;
	flex-wrap:wrap;
}

ul.index_4column li,
ul.index_4column li1,
ul.index_4column li2,
ul.index_4column li3,
ul.index_4column li4,
ul.index_4column li5,
ul.index_4column li6,
ul.index_4column li7{
	display:flex;
	align-items:center;     /* 縦中央 */
	justify-content:center; /* 横中央 */
	text-align:center;      /* テキスト中央 */
}

ul.index_4column li{
	width: calc(25% - 20px);
	min-height: 400px;
	padding:10px;

	display:flex;
	align-items:center;
	justify-content:center;

	text-align:center;
	color:#fff;
}

.box2{
background:url("https://leftec.pro/wp-content/uploads/2023/04/index_img01.jpg") center/cover no-repeat;
}

.box3{
background:url("https://leftec.pro/wp-content/uploads/2023/04/index_img02.jpg") center/cover no-repeat;
}

.box4{
background:url("https://leftec.pro/wp-content/uploads/2023/04/index_img03.jpg") center/cover no-repeat;
}

.box5{
background:url("https://leftec.pro/wp-content/uploads/2023/04/index_img04.jpg") center/cover no-repeat;
}

.box6{
background:url("https://leftec.pro/wp-content/uploads/2023/04/index_img05.jpg") center/cover no-repeat;
}

.box7{
background:url("https://leftec.pro/wp-content/uploads/2023/04/index_img06.jpg") center/cover no-repeat;
}

.box8{
background:url("https://leftec.pro/wp-content/uploads/2023/04/index_img07.jpg") center/cover no-repeat;
}







.wrap {
  display: flex;
  align-items: stretch;
}

.wrap2 {
  display: flex;
  align-items: stretch;
  flex-direction: row-reverse;
}

.index_box_img01 {
  flex: 1.0;             /* 横幅を均等に */
	background: url("http://kintaro-t.com/wp-content/uploads/2026/06/index_service01.jpg") repeat center center;
	background-size: cover;
}

.index_box_img02 {
  flex: 1.0;               /* 横幅を均等に */
	background: url("http://kintaro-t.com/wp-content/uploads/2026/06/index_service02.jpg") repeat center center;
	background-size: cover;
}

.index_box_img03 {
  flex: 1.0;               /* 横幅を均等に */
	background: url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/index_img03.jpg") repeat center center;
	background-size: cover;
}

.index_box_img04 {
	flex: 1.0;
	display: flex;
	align-items: center;   /* 下揃え */
	position: relative;   /* 追加 */
	z-index: 10;
}

.index_box_img05 {
  flex: 1.0;               /* 横幅を均等に */
	background: url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/05/processing_img.jpg") repeat center center;
	background-size: cover;
}

.index_box_img06 {
  flex: 1.0;               /* 横幅を均等に */
	background: url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/05/construction_img.jpg") repeat center center;
	background-size: cover;
}

.index_box {
  flex: 1.0;             /* 横幅を均等に */
  padding: 100px 80px;
}

.index_title01 {
	float: left;
	width: calc(100%  - 0px);
	margin: 0px auto;
	margin-bottom: 30px;
	padding: 0px;
	font-size: 26px;
	line-height: 1.8;
}

.index_title02 {
	float: left;
	width: calc(100%  - 0px);
	margin: 0px auto;
	margin-bottom: 10px;
	padding: 0px;
	font-size: 22px;
	line-height: 1.8;
}

.index_title30 {
	margin: 0px;
	margin-bottom: 30px;
	padding: 0px;
	font-size: 30px;
}

.index_title60 {
	margin: 0px;
	margin-bottom: 40px;
	padding: 0px;
	font-size: 60px;
}

.index_textbox {
	width: calc(100% - 0px);
	text-align: center;
	margin-bottom: 50px;
}

.index_text {
	display: inline-block;
	max-width: 930px;
	margin-bottom: 20px;
	padding: 0px;
	text-align: left;
}

.index_text_sbox01 {
	float: left;
	margin: 5px 5px;
	padding: 2px 15px;
	font-size: 18px;
	text-align: center;
	color: #000;
	background: #fff;
	border-radius: 5px;
}

.index_text01 {
	width: calc(100%  - 0px);
	margin: 0px auto;
	margin-bottom: 40px;
	padding: 0px;
	text-align: center;
}


.index_tel {
	float: left;
	width: calc(100%  - 0px);
	margin: 0px auto;
	margin-bottom: 30px;
	padding: 0px;
	font-size: 50px;
	line-height: 1.8;
}

.index_info_box {
	float: left;
	width: calc(100%  - 0px);
	margin: 0px auto;
	padding: 80px 0px;
	font-size: 13px;
	line-height: 1.8;
	color: #333;
	background: #fff;
}

.index_info_sbox {
	float: left;
	width: calc(100%  - 140px);
	margin: 0px auto;
	padding: 0px;
	font-size: 13px;
}

.index_info_title01 {
	float: left;
	width: 100px;
	margin: 0px auto;
	margin-right: 40px;
	padding: 0px;
	font-size: 26px;
	line-height: 1.4;
	writing-mode: vertical-rl;
}

.index_showroom_bg01 {
	float: left;
	width: 100%;
	height: 300px;
	margin: 0px;
	margin-top: -80px;
	padding: 0px;
	background: url("https://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/index_shoroom_img02.jpg") repeat center center;
	background-size: cover;
}



/* ===============================
   loopSlider 共通設定
=============================== */
.loopSliderWrap {
    top: 0;
    left: 0;
    position: absolute;
}

.loopSlider {
    margin: 0;
    width: calc(100% - 40px);
    margin-left: 20px;
    margin-right: 20px;
    text-align: left;
    position: relative;
    overflow: hidden;
}

.loopSlider ul {
    float: left;
    display: flex;
    width: max-content;
    padding: 0;
    margin: 0;
}

.loopSlider ul li {
    margin-left: 10px;
    margin-right: 10px;
    border-radius: 10px;
    overflow: hidden;
    flex: none;
}

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

/* ===============================
   サイズバリエーション
=============================== */

/* 小（現状と同じ） */
.loopSlider.small {
    height: 170px;
}
.loopSlider.small ul {
    height: 170px;
}
.loopSlider.small ul li {
    width: 170px;
    height: 170px;
}

/* 横長サイズ */
.loopSlider.small ul li.wide {
    width: 300px;
    height: 170px;
}

/* 中 */
.loopSlider.medium {
    height: 200px;
}
.loopSlider.medium ul {
    height: 200px;
}
.loopSlider.medium ul li {
    width: 200px;
    height: 200px;
}

/* 大 */
.loopSlider.large {
    height: 200px;
}
.loopSlider.large ul {
    height: 200px;
}
.loopSlider.large ul li {
    width: 300px;
    height: 200px;
}

/* ===============================
   CLEARFIX（不要なので軽量化）
=============================== */
.loopSliderWrap:after {
    content: "";
    display: block;
    clear: both;
}



/* ------------------------------
   半画面横スクロール
------------------------------ */
.horizontal-section{
  position:relative;
  height:100vh;
  overflow:hidden;
}

.horizontal-wrapper{
  display:flex;
  height:100vh;
  width:400vw;
}

.panel{
 width: calc(50vw  - 80px);
	height:100vh;
	padding: 40px;
	flex-shrink:0;
	font-size: 26px;
	text-align: center;
	display:flex;
	align-items:center;
	justify-content:center;
}

.panel::before{
  content:"";
  position:absolute;
  inset:0;
  background-color: rgba(0,0,0,0.3);
	background-image: radial-gradient(#000 0%, transparent 15%), radial-gradient(#000 0%, transparent 15%);
	background-size: 4px 4px;
	background-position: 0 0, 2px 2px;
}

.panel h2{
  position:relative;
  z-index:2;
}

.panel0{
	color:#fff;
	position:relative;
	background-image:url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/background.jpg");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.panel1{
	color:#fff;
	position:relative;
	background-image:url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/index_advice01.jpg");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.panel2{
	color:#fff;
	position:relative;
	background-image:url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/index_advice02.jpg");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.panel3{
	color:#fff;
	position:relative;
	background-image:url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/index_advice03.jpg");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.panel4{
	color:#fff;
	position:relative;
	background-image:url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/index_advice04.jpg");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.panel5{
	color:#fff;
	position:relative;
	background-image:url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/index_advice05.jpg");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.panel6{
	color:#fff;
	position:relative;
	background-image:url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/index_advice06.jpg");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.panel7{
	color:#fff;
	position:relative;
	background-image:url("http://leftec.pro/2026_leftec.pro/wp-content/uploads/2026/03/index_advice07.jpg");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}



ul.index_youtube{
	max-width:1100px;
	margin:0 auto 50px;
	padding:0;
	display:flex;
	flex-wrap:wrap;
}

ul.index_youtube li{
	list-style:none;
	margin:10px;
}

/* 2列 */
ul.index_youtube li.col2{
	width:calc(50% - 20px);
}

/* 3列 */
ul.index_youtube li.col3{
	width:calc(33.333% - 20px);
}










@media screen and (max-width: 959px) {
	/* 959px以下に適用されるCSS（タブレット用） */
	
}









@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用） */

/* ===============================
   メインビジュアル
=============================== */
.new_movie {
  height: 65vh; /* 100vhやめる */
  top: 0;
  margin-bottom: 0;
}

.new_movie p {
  width: 70%;
  font-size: 12px;
  letter-spacing: 0.2em;
  line-height: 1.8;
}

/* ===============================
   4カラム → 1カラム
=============================== */
ul.index_4column {
  display: block;
}

ul.index_4column li {
  width: 100%;
  min-height: 200px;
  margin-bottom: 10px;
}

/* ===============================
   横並びセクション → 縦積み
=============================== */
.wrap,
.wrap2 {
  display: block;
}

.index_box {
  padding: 40px 15px;
}

.index_box_img01,
.index_box_img02,
.index_box_img03,
.index_box_img05,
.index_box_img06{
  height: 200px; /* 画像高さ固定 */
}

/* ===============================
   タイトル調整
=============================== */
.index_title60 {
  font-size: 28px;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
}

.index_title30 {
  font-size: 20px;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
}

.index_title01 {
  font-size: 18px;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
}

.index_title02 {
  font-size: 16px;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
}

/* ===============================
   テキスト
=============================== */
.index_text {
  padding: 0 0px;
  font-size: 14px;
}
	
.index_tel {
	float: left;
	width: calc(100%  - 0px);
	margin: 0px auto;
	margin-bottom: 30px;
	padding: 0px;
	font-size: 30px;
	line-height: 1.8;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
}
	
.index_info_sbox {
	float: left;
	width: calc(100%  - 0px);
	margin: 0px auto;
	padding: 0px;
	font-size: 13px;
}
	
.index_info_title01 {
	float: left;
	width: 100%;
	margin: 0px auto;
	margin-right: 40px;
	padding: 0px;
	font-size: 26px;
	line-height: 1.4;
	writing-mode: horizontal-tb;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal;
}

/* ===============================
   横スクロールパネル
=============================== */

.horizontal-wrapper{
  width:800vw;
}
	
.panel{
 width: calc(100vw  - 80px);
	padding: 40px;
	font-size: 20px;
	font-family: "Shippori Mincho", serif;
	font-weight: 500;
	font-style: normal; 
	display:flex;
	align-items:center;
	justify-content:center;
}	


/* ===============================
   スライダー
=============================== */
.loopSlider.small {
  height: 100px;
}
.loopSlider.small ul li {
  width: 100px;
  height: 100px;
}
.loopSlider.small ul li.wide {
    width: 180px;
    height: 100px;
}

.loopSlider.medium {
    height: 120px;
}
.loopSlider.medium ul {
    height: 120px;
}
.loopSlider.medium ul li {
    width: 120px;
    height: 120px;
}

.loopSlider.large {
  height: 140px;
}
.loopSlider.large ul li {
  width: 200px;
  height: 140px;
}

/* ===============================
   YouTube
=============================== */
ul.index_youtube li.col2,
ul.index_youtube li.col3 {
  width: 100%;
}

/* ===============================
   背景固定解除（超重要）
=============================== */
.index_bbox01,
.index_bbox04 {
  background-attachment: scroll;
}
	
.index_bbox03 {
	padding-top: 30px;
}
	
	
	
}