@charset "utf-8";
/* CSS Document */
/* 共通で使える追加スタイル　style1 に基がないもの中心、行数大きい方が優先 */


.kadoR-8 {		/* 角丸8px */
	border-radius: 8px;
}

.kadoR {		/* 角丸 */
	border-radius: 100vh;
}


.mono { 		/* モノクロに *//*IE非対応？*/
	filter: grayscale(100%)
}

.mono-60 { 		/* モノクロにして透過60% *//*IE非対応？*/
	filter: grayscale(100%) opacity(60%);
}


.txt-img, .txt-img li { 		/* 画像の上にテキスト */
	position: relative;
}

.txt-img h3 { 		/* 画像の上テキスト16px左上 */
	position: absolute;  /* relativeの要素を基準にする */
	top: 17px;
	left: 21px;	
	line-height: 1.45em;
	letter-spacing: .07em;
	padding-right: 18px;
	margin: 0;
}

.txt-img h5 { 		/* 画像の上テキスト16px右上 */
	position: absolute;  /* relativeの要素を基準にする */
	top: 17px;
	right: 30px;
	line-height: 1.45em;
	letter-spacing: .07em;
	padding-left: 21px;
	margin: 0;
}

.txt-img p { 		/* 画像の上テキスト14px左下 */
	position: absolute;  /* relativeの要素を基準にする */
	bottom: 18px;
	left: 21px;
	line-height: 1.45em;
	letter-spacing: .07em;
	padding-right: 21px;
	margin: 0;
}

.txt-img img {
	width: 100%; /*px固定したいときは、親要素で指定*/
}


.txt-img-detail {		/* 詳しくははこちら、style1.detailを基に左揃え */
	display: inline-block;
    left: 30px;
    bottom: 22px;
    font-size: 14px;
    line-height: 1.42em;
    font-weight: 400;
    text-align: center;
    height: 21px;
    width: 160px;
    border: 1px solid;
    vertical-align: text-top;
    padding: 0;
    margin-top: .5em;
}

.lineup-block-L {		/* style1.lineup-block text-align: center;を削除 */
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: auto;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lineup-block-L li{
	height: auto;
	padding: 0;
	margin: 0 0 34px 0;
}

.lineup-block-L p {
	line-height: 1.5em;
	margin: .75em 0;
}


.thispage {			/*.btn-tech 今見ているページ aタグに */
	background-color: lightgray;
}


.fontL-txt-img { 		/* 文字大 16pxが30px */
	font-size: 1.875em;
	line-height: 1.2em;
}

.font-w200{			/* 文字ウェイト200 */
	font-weight: 200;
}

.point {			/* 文字.8で上揃え下線 */
	font-size: .8em;
	font-weight: 600;
	border-bottom: solid;
	border-width:　.25em;
	vertical-align: .2em;
}


.material-icons {			/* Google-material-icons */
	font-family: 'Material Icons';
	font-weight: normal;
	font-style: normal;
	font-size: 24px;  /* Preferred icon size */
	display: inline-block;
	line-height: 1;
	vertical-align: middle;
	text-transform: none;
	letter-spacing: normal;
	word-wrap: normal;
	white-space: nowrap;
	direction: ltr;
	/* Support for all WebKit browsers. */
	-webkit-font-smoothing: antialiased;
	/* Support for Safari and Chrome. */
	text-rendering: optimizeLegibility;
	/* Support for Firefox. */
	-moz-osx-font-smoothing: grayscale;
	/* Support for IE. */
	font-feature-settings: 'liga';
}

/* Rules for sizing the icon. */
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-28 { font-size: 28px; }
.material-icons.md-36 {	font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }


/* LP */
.hr-header-lp {
    border-top: 1px solid #C8C8C8;
	padding: 0;
    margin: 2px 0 0 0;
}

.container-lp {
	width: 960px;
	font-size: 16px;
	line-height: 1.5em;
	letter-spacing: 0em;
	text-align: center;
	padding: 0px;
	margin: 1.875em auto 3em;	/*1.875em=30px*/
}

.container-lp h1{
	display: inline-block;
	font-size: 24px;
	font-weight: 600;
	line-height: 1.5em;
	color: gray;
	letter-spacing: 0.01em;
	text-align: center;
	margin: 0 auto 1.25em;	/*1.25em=30px*/
}

.container-lp p {
	display: inline-block;
	font-weight: 400;
	margin: 0 auto 1.5em;	/*1.5em=24px*/
}

/* ＼あ／ */
.speech-bubble {
	font-size: 16px;
	padding: 0.375em 0 1.25em 0;	/*6 0 20 0px*/
	text-align: center;
}

.speech-bubble span {	/* 下線 */
    background: linear-gradient(transparent 65%, #FFF100 65%); 
}

.color-red-lp {
	font-weight: 500;
	color: #ff2116;
	letter-spacing: 0.1em
}

.color-webform-blue {
	font-weight: 500;
	color: #4687F5;	/*お問い合わせの青*/
	letter-spacing: 0.02em
}

/* CVボタン */
.btn-lp {
    display: flex;
    flex-wrap: wrap;
	justify-content: center;
    padding: 0;
    margin: 0 -1.875em 1em 0;
}

.btn-lp li {
    list-style: none;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    line-height: 1.25em;
    padding: 0 56px;	/*左右heightと同じ*/
    margin: 0 1.875em 1.875em 0;
	height: 56px;
    background-color: #FF2116;
    border-radius: 100vh;
    position: relative;
}

.btn-lp-dl a, .btn-lp-cr a {
	font-size: 18px;
	font-weight: 500;
	color: #fff;
	padding: 0 0 0.1em 0;
	letter-spacing: 0.02em;
	text-align: center;/*一応BOX内の文字も中央寄せ*/
}

.btn-lp-dl a:after {	/*ダウンロード*/
    display: block;
    content: 'file_download';
    font-family: "Material Icons";
    font-size: 24px;
    position: absolute;
	top: 50%;
    -webkit-transform: translateY(-52%);
    transform: translateY(-52%);
	right: 12px;
}

.btn-lp-cr a:after {	/*リンクへ＞*/
    display: block;
    content: 'chevron_right';
    font-family: "Material Icons";
    font-size: 24px;
    position: absolute;
	top: 50%;
    -webkit-transform: translateY(-52%);
    transform: translateY(-52%);
	right: 8px;
}

.webform-lp {
	width: 75%;
	padding: 0 0 1em 0;
	margin: auto;
}

.webform-lp h2 { /* style1 webform */
	font-size: 20px;
    font-weight: 400;
    line-height: 1.2em;
    color: #FFFFFF;
    padding: 8px 20px 9px;
    margin: 0;
    background-color: #4687f5;
    border-radius: 6px;
    letter-spacing: 0.1em;
}

.webform-lp p { /* style1 p */
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5em;
	margin: 1em 0;
}
