/* ===================================================================
CSS information
 file name  :  custom.css
 style info :  お客様用　上書きcss
=================================================================== */

html {
	scroll-behavior: smooth;
}

/* ==== よくある質問  ==== */

.anchor{
	padding-top:110px;
	margin-top:-110px;
}

@media only screen and (max-width: 690px){
	.anchor{
		padding-top:55px;
		margin-top:-55px;
	}	
}

li.box_s{
	box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.10);
}

.faqbox{
	background:#f5f5f5;
}

.faqflex {
	display:flex;
	align-items: center;
	background:#fff;
}

img.faqflex__img{
	padding:0 40px;
	width:100%;
	height:70%;
	object-fit: cover;
	max-width:300px;
}

.faqflex__txt{
	padding:0 40px;
	flex: 1;
}

.faqflex__btn{
	width:100%;
	max-width:280px;
	padding:0 40px;
}

.dlb_btn_not {
    display: block;
    padding: 16px 1.5em 16px 2.5em;
    text-align: center;
    position: relative;
    border-width: 2px;
    border-style: solid;
	background:#989898;
	color:#fff;

}

@media only screen and (max-width: 690px){
	.faqflex {
		display:block;
	}
	
	.faqflex__txt{
		padding-bottom:30px;
	}
	.faqflex__txt h2{
		text-align:center;
	}
	
	.faqflex__btn{
		width:100%;
		max-width:280px;
		margin:auto;
		padding-bottom:20px;
	}

}



/* ==== ハイスピードカメラ・画像計測機器のよくある質問  ==== */

ul.menu_btn_d332_white li a {
	background-color: #fff;
}


ul.menu_btn_d332_white li a::before{
	width: 0;
	height: 0;
	border-style: solid;
	border-right: 6px solid transparent;
	border-left: 6px solid transparent;
	border-top: 11px solid #0d72b4;
	border-bottom: 0;
	transform: rotate(0deg);
}


ul.menu_btn_d332_white li a:hover::before {
	border-right: 6px solid transparent;
	border-left: 6px solid transparent;
	border-top: 11px solid #fff;
}




.faqinbox {
	padding:30px 0 50px;
	background: #E2E9F0;
}



.faqdtl {
    max-width: 980px;
    margin: auto;
    border: none;
    box-shadow: 0 4px 4px rgb(0 0 0 / 2%), 0 2px 3px -2px rgba(0 0 0 / 5%);
    background-color: #fff;
	margin-top:20px;
}

@media only screen and (max-width: 690px){
	.faqdtl {
	    margin: 0 5px 10px;
	}
}

.faqdtl summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 1.5em 3em;
    color: #333333;
    font-weight: 600;
	font-size:1.2em;
    cursor: pointer;
}

.faqdtl summary::before,
.faqdtl p::before {
    position: absolute;
    left: 1em;
    font-weight: 600;
	font-size:1.2em;
    font-size: 1.3em;
}

.faqdtl summary::before {
    color: #75bbff;
    content: "";
}

.faqdtl summary::after {
	color:#ccc;
    box-sizing: border-box;
    content: '\2b';
    display: block;
    font-family: "Font Awesome 5 Free";
    /*height: 52px;*/
    padding: 10px 20px;
    position: absolute;
    right: 0;
    /*top: 0px;*/
	font-size:1.7em;
}

.faqdtl summary:hover {
    color:#0D72B4;
}
/*.faqdtl summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 7px;
    height: 7px;
    margin-left: 10px;
    border-bottom: 3px solid #333333b3;
    border-right: 3px solid #333333b3;
    content: '';
    transition: transform .5s;
}
*/


.faqdtl[open] summary{
	color:#8C9FAC;	
}

.faqdtl[open] summary::after {
    transform: rotate(45deg);
	transition: 0.2s;
}

.faqdtl p {
    position: relative;
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: 2em 3em 2em;
    color: #333;
    transition: transform .5s, opacity .5s;
	background:#F5F5F5;
	font-size:1.1em;
}

.faqdtl .list_faq {
    position: relative;
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: 2em 3em 2em;
    color: #333;
    transition: transform .5s, opacity .5s;
	background:#F5F5F5;
	font-size:1.1em;
}


@media only screen and (max-width: 690px){
	.faqdtl p {
		font-size: 1.0em;
	}
}

.faqdtl[open] p, .faqdtl[open] .list_faq {
    transform: none;
    opacity: 1;
}

.faqdtl p::before {
    color: #ff8d8d;
    line-height: 1.2;
    content: "A";
}


.faqdtl p a {
	text-decoration: underline;
	/*font-size:1.08em;*/
	font-weight:bold;
	color:#0d72b4;
}

.faqdtl p a:hover {
	color:#94B4CB;
}


.faqdtl p.txt_kink {
    padding: 0 3em 2em;
}

.faqdtl p.txt_kink::before {
	display:none;
}

.faqdtl p.txt_kink a {
	display: block;
	text-align: right;
}

.txtbox_faq{
	display:flex;
	justify-content: space-between;
	align-items: center;
	border: 3px solid #0D72B4;
	padding:40px 50px;
}

.txtbox_faq .btn_flex {
	width:100%;
	max-width:400px;
}

@media only screen and (max-width: 690px){
	
	.txtbox_faq{
		display:block;
		padding:20px;
	}
	.txtbox_faq p{
		margin-bottom:30px;
	}
}


.test_txt_red p {
	color:#f00;
}


/* ==== ひずみ解析システム DIC（デジタル画像相関法）/measure/software/mercury  ==== */

@media only screen and (max-width: 690px){
	.col2_2 .col{
	    width: calc(50% - 5px);
	    margin-right: 0;
	}
}


/*  Thermera の二色温度計測原理  */

.numbox{
	background: #fdd7df; 
	border-left: 3px solid #c00; 
	border-right: 3px solid #c00; 
	padding: 10px;
	display:flex;
	justify-content: space-around;
	align-items: center;
}

.numbox .numtitletxt{
	position: relative;
    padding: 1rem;
    color: #353535;
    font-weight: bold;
	flex-grow: 0.2; 
}


.numbox .numtitletxt:after {
    position: absolute;
    top: 48%;
    width: 10rem;
    border-top: 3px dotted;
    content: '';
	right: -10rem;
	flex-grow: 0; 
}

@media only screen and (max-width: 690px){
	.numbox .numtitletxt:after {
    	display:none;
	}
}

.numbox .numtitlenum {
	flex-grow: 0.2; 
}



@media only screen and (max-width: 690px){
	.dlb_box2-2_img02 {
		width: 100%;
    	height: 100%; !important;
    	-webkit-box-ordinal-group: 1;
    	-ms-flex-order: 0;
    	order: 0;
	}
}



.dlb_box2-2_txt_02 {
	width: 50%;
	padding: 48px 30px 48px 32px !important;
}



/* HS_LPのスライドが動かない時の代替CSS */


/* カルーセルの外枠 */
.carousel {
  /*width: 320px;
  height: 120px;*/
  display: flex;    /* 子要素を横に並べる */
  overflow: hidden; /* はみ出た部分は表示しない */
  margin: 0 auto;   /* 水平方向中央寄せ */
}
/* カルーセル内の画像 */
.carousel img {
  margin: 0;
  padding: 0;
  display: block; /* imgタグの改行のすき間を消すため */
}
/* スクロールアニメーションのキーフレーム */
@keyframes scroll {
  /* 初期位置は1個目の画像が左端 */
  0% { margin-left: 0; }      
  /* 1個分左の位置に進めて2個目の画像を左端にする */
  30% { margin-left: -100%; }
  /* 少しの間上と同じ位置 */  
  35% { margin-left: -100%; }
  /* 2個分左の位置に進めて3個目の画像を左端にする */
  65% { margin-left: -200%; }
  /* 少しの間上と同じ位置 */  
  70% { margin-left: -200%; }
  /* 以降は上と同様に繰り返し */
  100% { margin-left: -300%; }
  105% { margin-left: -300%; }
}
/* カルーセルの子要素にスクロールアニメーションを設定 */
.carousel > :first-child {
  animation-name: scroll;    /* キーフレーム名 */
  animation-duration: 10s;  /* 再生時間全体は20秒 */
  animation-delay: 0s;      /* 読込直後から遅延無しで開始 */
  animation-iteration-count: infinite;  /* 無限に繰り返す */
}



/* ==== 下部ナビゲーションの修正 HS・3D  ==== */

.partcol2 .partcol, .partcol4 .partcol {
	display:flex;
	flex-flow: column;
	padding: 20px;
	background:#fff;
	border-radius: 8px;
	box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.20);
	justify-content: space-between;
}

.partcol4 .partcol:hover {
	opacity: 0.7;
}


.partcol2  .bl-hover h2, .partcol4 .bl-hover h2 {
	color:#0D72B4;
}


.partcol2 .partcol .partcolboxbtn .dlb_btn a, .partcol4 .partcol .partcolboxbtn .dlb_btn a  {
	border:none;
	background:#fff;
	color:#1558D6;
	text-align: left;
	text-decoration:underline;
	padding:0;
}




.partcol2 .partcol .partcolboxbtn .lr_arrows a, .partcol4 .partcol .partcolboxbtn .lr_arrows a {
    border: none;
    background: #fff;
    color: #1558D6;
    text-align: left;
    text-decoration: underline;
    padding: 0 0 0 40px;
}



.partcol2 .partcol .partcolboxbtn .lr_arrows a::after, .partcol4 .partcol .partcolboxbtn .lr_arrows a::after {
	/*content: url("../image/lrarrows-icon.svg");*/  /*画像のURL*/
	content:'';
	background:url("../image/lrarrows-icon.svg");
    margin-right:20px;  /*画像右の余白*/
    width: 30px;
    height: 28px;
    transform: rotate(0deg);
    position: absolute;
	border-width: 0;
    top: 0;
    left: 0;
    transition: all .1s ease-in 0s;
}

.partcol2 .bl-hover .partcolboxbtn .lr_arrows a:hover::after, .partcol4 .bl-hover .partcolboxbtn .lr_arrows a:hover::after {
	/*content: url("../image/lrarrows-icon.svg");*/  /*画像のURL*/
	content:'';
	background:url("../image/lrarrows-icon__on.svg");
}





/* ==== 全体aタグの装飾設定  ==== */

a.alinkbtn{
	color:#0D72B4;
	text-decoration: underline;
	font-weight:bold;
}

a.alinkbtn:hover{
	color:#0D72B4;
	text-decoration: none;
	opacity: 0.7;
}



/* ==== tableのセル別色装飾設定  ==== */

.dlb_table_03_2_02 tr:nth-child(odd) td {
    background-color: #f5f5f5;
}

/* ==== 白抜きのボタンの応急処置  ==== */

.dlb_c62_box a:hover {
	opacity: 0.5;
}

/* ==== pravボタン  ==== */

ul.backnext_btn{
	display: flex;
	flex-wrap: wrap;
	justify-content:space-between;
	
}

ul.backnext_btn li {
	list-style:none;
}

ul.backnext_btn li a {
	position: relative;
    font-weight: bold;
    color: #0D72B4;
}

ul.backnext_btn li.prev a {
	padding-left:18px;
}

ul.backnext_btn li.prev a::after {
    clip-path: polygon(0% 50%, 100% 100%, 100% 0%);
    left: 0;
	content: "";
    position: absolute;
    top: 4px;
    display: block;
    width: 10px;
    height: 13px;
    background-color: #0D72B4;
}

ul.backnext_btn li.next a {
	padding-right:18px;
}

ul.backnext_btn li.next a::after {
	clip-path: polygon(0 0, 0% 100%, 100% 50%);
    right: 0;
	content: "";
    position: absolute;
    top: 4px;
    display: block;
    width: 10px;
    height: 13px;
    background-color: #0D72B4;
}




/* ==== 見出しの帯の色設定  ==== */
.titlecolor--red{
	color:#fff;
	background-color:#e1242b;
}

.titlecolor--sky{
	color:#fff;
	background-color:#00adef;
}

.titlecolor--blue{
	color:#fff;
	background-color:#2178bd;
}

.titlecolor--navy{
	color:#fff;
	background-color:#273e9b;
}

.titlecolor--crimson{
	color:#fff;
	background-color:#c31c2d;
}

.titlecolor--orange{
	color:#fff;
	background-color:#f56421;
}


/* ==== ThermeraLPの写真下のロゴ用設定  ==== */

@media only screen and (min-width: 691px){
	.dlb_box2-3_txt_ThermeraLP {
	    float: right;
	    width: calc(100% - 35.5% - 5px) !important;
	}
}


/* ==== KKレンタルページ  ==== */

/* リストトップにチェックマークのアイコン */
.dlb_list_img li.liCheckicon {
	background: url('../image/iconCheck_blue.gif')no-repeat;
	background-size: 16px;
	background-position-y:3px;
}


/* スライダーのcss */

.pic-container {
    background-color: #fff;
    display: grid;
    height: 100%;
}

.slider {
    display: flex;

    background-color: #efefef;
    overflow: hidden;
}

.slider-list {
    display: flex;
    margin: 0;
    padding: 0;
    align-items: center;
    animation: slideShow 25s infinite linear;
    list-style: none;
}

.slider-item {
    width: 400px;
    height: 250px;
}

.slider-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 0 0.5rem;
}

.slider:hover .slider-list {
    animation-play-state: paused;
}

@keyframes slideShow {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-100%);
    }

}
/* ==== KKアークページ  ==== */
@media only screen and (min-width: 691px) {
	.yokonarabi {
		width: 100%;
		display: flex;
	}
	.yokonarabi img {
		width: auto;
		max-width: 100%;
		height: auto;
		max-height: 274px;
	}
}



/* 3つ並び黄色矢印フローの間隔調整 */

@media only screen and (min-width: 979px) {
  .dlb-flow_area_3 .pc_w46 {
    width: 46% !important;
  }
}

.dlb-flow_area_3 .dlb-flow_arr_pc_w46 {
	width: 8% !important;
}


/* ハイスピードカメラ スライドの幅崩れ　修正 */
@media only screen and (min-width: 691px){
	.dlb_c65_img_area_w45 {
		width:45% !important;
	}
}



/* カタログ一覧 hover　修正 */

.catalog-img {
	cursor: pointer;
	max-width: 500px;
	overflow: hidden;
	width: 100%;
	box-shadow: 0px 0px 10px 0px rgba(140,140,140,0.3);
	-webkit-box-shadow: 0px 0px 10px 0px rgba(140,140,140,0.3);
	-moz-box-shadow: 0px 0px 10px 0px rgba(140,140,140,0.3);
}

.catalog-img img {
	height: auto;
	transition: transform .4s ease;/* ゆっくり変化させる */
	width: 100%;
}

.catalog-img:hover img {
	transform: scale(1.1);/* 拡大 */
}



/* カタログ一覧 a範囲拡大 */
.catalog-img a {
		  position: absolute;
	width:100%;
	height:100%;
		  top: 0;
		  right: 0;
		  bottom: 0;
		  left: 0;
		  z-index: 1;
		  pointer-events: auto;
		  content: "";
		  background-color: transparent;
}



/* 採用情報 hover管理 */



.saiyoubox01, .saiyoubox02 {
	border: solid 1px #ccc;
}

.saiyoubox01 a, .saiyoubox02 a {
	text-decoration: none;
	display: block;
	padding: 20px 30px;
}

.saiyoubox01 a:hover, .saiyoubox02 a:hover {
	opacity: 0.5; 
}

.hoverline_midashi{
	padding-bottom: 4px;
	padding-left:12px;
	border-bottom: solid 1px #ccc;
	position:relative;
}

.hoverline_midashi::before {
	content: '';
	position: absolute;
	top: -2px;
	bottom: 0;
	left: 0;
	width: 0;
	height: 0;
	margin: auto;
	border-top: 6px solid transparent;
	border-right: 0 solid transparent;
	border-left: 9px solid #0d72b4;
	border-bottom: 6px solid transparent;
	box-sizing: border-box;
}

.saiyoubox01:hover p.hoverline {
  background: linear-gradient(transparent 50%, #0d72b526 50%);
	&::after {
		transform: scale(0, 1);
		transform-origin: left top;
		transition: transform 0.6s;
	}
}
.saiyoubox02:hover p.hoverline {
  background: linear-gradient(transparent 50%, #0d72b526 50%);
	&::after {
		transform: scale(0, 1);
		transform-origin: left top;
		transition: transform 0.6s;
	}
}





/*
.saiyoubox01:hover p.hoverline::after{
    content: "";
    display: block;
    position: relative;
    left: 0;
    bottom: 0px;
    width: 0;
    height: 10px;
    background: rgba(13, 114, 181, 0.15);
    transition: 0.6s;
}

.saiyoubox02:hover p.hoverline::after{
    content: "";
    display: block;
    position: relative;
    left: 0;
    bottom: 0px;
    width: 0;
    height: 10px;
    background: rgba(13, 114, 181, 0.15);
    transition: 0.6s;
}

.saiyoubox01 a::after,.saiyoubox02 a::after {
opacity: 0;
}

a:hover::after {
opacity: 1;
transition: 0.6s;
}

/*
p.hoverline::after{
    background-color: royalblue;
}
*/
/*
.hoverline::after {
    content: "";
    display: block;
    position: relative;
    left: 0;
    bottom: 0px;
    width: 0;
    height: 10px;
    background: rgba(13, 114, 181, 0.15);
    transition: 0.6s;
}
*/