@charset "UTF-8";

/*Copyright 2018 Hyuga Kouzai.*/
/* CSS Document */
/* ------------------------------------------------ */
/* 加工事例用(process.html)
/* ------------------------------------------------ */
h2:nth-child(2) {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	-webkit-align-items: center; 	
	align-items: center; 	
	-webkit-justify-content: center; 	
	justify-content: center;
    width: 90%;
	margin:1rem auto;
	color: #003366;
	text-align:left;
	line-height:1.1rem;
	font-size: 1.5vw;
	letter-spacing:4px;
	padding: 0.5rem;
	border-top:4px double #006699;
	border-bottom:4px double #006699;
	background-color: #fff;
	background-image: none;
	background-repeat: no-repeat;
	background-position:center top;
	height:100%;
}
/*サブページタイトル設定マーク付き products.html process.html machine.html */
 .sub_toptitle {
	background-color: #fff;
	color: #4e4e4e;
	text-align:left;
	line-height:1rem;
	font-weight: bold;
	font-size: 2vw;
	margin:1rem;
	padding: 0.5rem 2rem;
	border-bottom:3px solid #999999;
	&:before{
		font-family: 'Font Awesome 5 Free';
		font-weight: 900;
		content: '\f14a';/*　'\f4d8';双葉*/
		padding-right:0.5rem;
		font-size:2vw;
	}
 }
#business_contents{
	width:80%;
	display: block;
	margin:0 auto;
	& img{
		width:100%;
		display:block;
		margin:0 auto;
	}
	& a{
		display:block;
        width:15rem;
		margin:0 auto;
        border:solid 1px red;
        padding:0.5rem;
        border-radius: 5px;;
		color:red;
		font-size:1.8vw;
		font-weight:bold;
		text-align:center;
	}
	& p{
		color:#4e4e4e;
		margin:1rem 2rem;
		font-size:1.8vw;
		font-weight:bold;
		line-height:1.1rem;
	}
	& .line_margin{
		padding:1rem 0;
		margin-top:1.5rem;
		font-size:2vw;
		letter-spacing:1rem;
		border-bottom: 2px dotted #cccccc;
		text-align:center;
	}
	& .sample{
		max-width: 70%;
		height: auto;
		margin-bottom:1rem;
	}
	& .movie-you_t{
		width:53%;
		margin:0 auto;
		& > .movie-wrap{
			position: relative;
			padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
			height: 0;
			overflow: hidden;
			& > iframe{
			position: absolute;
			top: 0;
			left: 0;
			width: 100% !important;
			height: 100% !important;
			}
		}
	}
}


/* ------------------------------------------------ */
/* タブレット 縦向き*/
/* ------------------------------------------------ */
@media screen and (orientation: portrait) and (min-width: 760px) and (max-width:1300px) {
    /*h2:nth-child(2) {
        font-size: 1.5vw;
    }*/
}

/* ------------------------------------------------ */
/* レスポンシブ（780px以下）
/* ------------------------------------------------ */
@media screen and (orientation: portrait) and (max-width:780px) {
    h2 {
        letter-spacing: 0.2em;
        margin-bottom:0;
        font-size: 1.1rem;
	}
    h2:nth-of-type(2) {
        text-align:left;
        letter-spacing: 0.1em;
        font-size: 0.8rem;
	}
	.sub_toptitle {
		font-size: 1.2rem;
		padding: 1rem;
		&:before{
			font-size:1.4rem;
		}
	}
	#business_contents{
    width:90%;
	& a{
		font-size:1rem;
	}
    & p{
        margin:1rem;
		font-size:0.8rem;
    }
    & .line_margin{
        padding:0.5rem 0;
        margin-top:.5rem;
		font-size:1rem;
    }
    & .movie-you_t{
        width:80%;
        margin:0 auto;
        }    
    }
}
/* ------------------------------------------------ */
/* 380px以下に対応
/* ------------------------------------------------ */
@media screen and (orientation: portrait) and (max-width:380px)  and (max-height: 890px){
    h2:nth-of-type(2) {
        text-align:left;
        font-size: 1rem;
    }
}

/* ------------------------------------------------ */
/* スマホ横向き時 450px以下 */
/* ------------------------------------------------ */
@media screen and (orientation: landscape) and (max-height: 450px) {
    h2 {
        letter-spacing: 0.2em;
        margin-bottom:0;
        font-size: 1.1rem;
    }
	h2:nth-of-type(2){
		text-align:left;
		font-size: 1rem;
	}
	.sub_toptitle {
		font-size: 1.4rem;
		padding: 1rem;
		&:before{
			font-size:1.4rem;
		}
	}
	/* youtube */
	.movie-you_t{
		width:80%;
		margin:0 auto;
	}
}

/* ------------------------------------------------ */
/* レスポンシブ（300px以下）
/* ------------------------------------------------ */
@media only screen and (max-width:300px) {
	h2{
		letter-spacing:0.1rem;
	}
}