@charset "UTF-8";
/*
	Reset CSS
-----------------------------------------------------------------------------------------------*/
/***
    The new CSS reset - version 1.7.3 (last updated 7.8.2022)
    GitHub page: https://github.com/elad2412/the-new-css-reset
***/
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)){
	all: unset;
	display: revert;
}
*,*::before,*::after{
	box-sizing: border-box;
}
a, button{
	cursor: revert;
}
ol, ul, li, menu{
	list-style: none;
}
img{
	max-width: 100%;
	vertical-align: top;
}
table{
	border-collapse: collapse;
	border-spacing: 0;
}
input, textarea{
	-webkit-user-select: auto;
	user-select: auto;
}
textarea{
	white-space: revert;
}
meter{
	-webkit-appearance: revert;
	appearance: revert;
}
::placeholder{
	color: unset;
}
:where([hidden]){
	display: none;
}
:where([contenteditable]:not([contenteditable="false"])){
	-moz-user-modify: read-write;
	-webkit-user-modify: read-write;
	overflow-wrap: break-word;
	-webkit-line-break: after-white-space;
	line-break: after-white-space;
	-webkit-user-select: auto;
	user-select: auto;
}
:where([draggable="true"]){
	-webkit-user-drag: element;
}
/*
	Setting CSS
-----------------------------------------------------------------------------------------------*/
html{
	font-size: 62.5%;
}
body{
	color:#000;
	font-size: 1.5em;
	font-family: 'Noto Sans JP', 'Yu Gothic', YuGothic, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	font-weight: 400;
	letter-spacing: 0.1rem;
	font-feature-settings: "palt";
	overflow-wrap: break-word;
}
.l-main{
	position: relative;
	z-index: 2;
}
p{
	line-height: 200%;
}
h1,h2,h3,h4{
	line-height: 1;
}
@media print, screen and (min-width:812px){
	/* iPad背景切れ対策 */
	body{
		min-width: 1200px;
	}
	/* tel pcのみ無効 */
	a[href^="tel:"]{
		pointer-events: none;
	}
}
/* 表示切替 */
.switch{
	visibility: hidden;
}
.sp{
	display: none;
}
/*
	common
-----------------------------------------------------------------------------------------------*/
:root{
	/* color */
	--bluebasegradation: linear-gradient(90deg, rgba(145, 130, 230, 1), rgba(0, 130, 210, 1));
	--yellowbasegradation: linear-gradient(90deg, rgba(255, 184, 70, 1), rgba(255, 113, 80, 1));
	--yellowhovergradation: linear-gradient(90deg, rgba(255, 184, 70, 1), rgba(254, 141, 120, 1));
	--baseblue: #0566D4;
	--lightblue: #E3F1FF;
	--baseyellow: #FAE600;
	--baseorange: #FE674C;
	/* font */
	--ffNoto: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', YuGothic, Meiryo, sans-serif;
	--ffOs: "Oswald";
	--tin: 100;
	--light: 300;
	--demlight: 400;
	--regular: 500;
	--medium: 600;
	--bold: 700;
	--black: 900;
	/* width */
	--maw: 1200px;
}
/* box
============================== */
/* wrapper */
#wrapper{
	overflow: hidden;
	position: relative;
}
.cts__base{
	padding: 120px 0;
}
.cts__area{
	max-width: var(--maw);
	margin: 0 auto;
	padding: 0 30px;
	position: relative;
}
/* tit
============================== */
.section__head{
	font-size: 4.6rem;
	font-weight: var(--bold);
	text-align: center;
}
.section__head-keyword{
	font-size: 6rem;
	font-weight: var(--bold);
	color: var(--baseblue);
}
/* btn
============================== */
.base__btn{
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: var(--yellowbasegradation);
	background-position: 1% 50%;
	border: 4px solid #fff;
	border-radius: 50px;
	font-size: 2rem;
	font-weight: var(--bold);
	height: 64px;
	padding: 0 20px;
	position: relative;
	width: 400px;
	box-shadow: 3px 3px 0px 0px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease-out;
}
.base__btn::before,
.base__btn::after {
	background: #FFF;
	content: '';
	height: 1px;
	position: absolute;
	right: 20px;
	transition: right 0.3s;
}
.base__btn::before {
	top: 50%;
	width: 14px;
	transform: translateY(-50%);
	right: 18px;
}
.base__btn::after {
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	background: none;
	width: 7px;
	height: 7px;
	top: 50%;
	margin: -1px 0 0 0;
	transform: rotate(45deg) translateY(-50%);
}
/* hover */
.base__btn:hover{
	background: var(--yellowhovergradation);
	text-decoration:none;
}
.base__btn:hover::before{
	right: 12px;
}
.base__btn:hover::after{
	right: 15px;
}
/* target="_blank"
============================== */
a[target="_blank"] span{
	background: url(/eye-portal/assets/img/link_icon02svg) no-repeat right center;
	background-size: 13px;
	display: inline-block;
	padding-right: 16px;
}
.btn__inquiry-trocco {
	display: inline-block;
	padding: 12px 10px;
	font-size: 1.3rem;
	font-weight: var(--bold);
	color: #fff;
	width: auto;
	writing-mode: vertical-lr;
	font-feature-settings: normal;
	border-radius: 15px 0 0 15px;
	position: fixed;
	height: auto;
	border-right: none;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	z-index: 10000;
	transition: opacity 0.3s;
	box-shadow: -3px 3px 0px 0px rgba(0, 0, 0, 0.1);
	opacity: 0;
}
.btn__inquiry-trocco::before,
.btn__inquiry-trocco::after{
	content: none;
}
.btn__inquiry-trocco.show {
    opacity: 1;
}
@media screen and (max-width:812px){
	img{
		width:100%;
	}
	.pc{
		display:none;
	}
	.sp{
		display:block;
	}
	br.sp{
		display:inline-block;
	}
	/*
		common
	-----------------------------------------------------------------------------------------------*/
	:root{
		--maw: 100%;
	}
	/* box
	============================== */
	.cts__base {
		padding: 60px 0;
	}
	.ctsArea{
		padding: 70px 15px;
	}
	/* tit
	============================== */
	.section__head{
		font-size: 2.4rem;
		font-weight: var(--bold);
		text-align: center;
	}
	.section__head-keyword{
		font-size: 3rem;
		font-weight: var(--bold);
		color: var(--baseblue);
	}
	/* btn
	============================== */
	.base__btn{
		font-size: 1.2rem;
		height: 50px;
		padding: 0 20px;
		width: 100%;
		max-width: 320px;
	}
	.base__btn::before,
	.base__btn::after {
		content: none;
	}
	/* target="_blank"
	============================== */
	a[target="_blank"] span{
		background: url(/eye-portal/assets/img/link_icon02svg) no-repeat right center;
		background-size: 13px;
		display: inline-block;
		padding-right: 16px;
	}
	.btn__inquiry-trocco {
		padding: 12px 10px;
		font-size: 1.2rem;
		width: auto;
		writing-mode: vertical-lr;
		font-feature-settings: normal;
		border-radius: 15px 0 0 15px;
		position: fixed;
		height: auto;
	}
	.btn__inquiry-trocco::before,
	.btn__inquiry-trocco::after{
		content: none;
	}
}