@charset "UTF-8";


/*基本色*/
:root{
    --main-color: #650d37;
    --accent-color: #77762ad4;
    --dark-color: #2b5566;
    --text-bright-color: #FFF;
    --icon-color: #fefefe;
    --icon-bk-color: #a9a504;
    --large-width: 1000px;
    --gray-color: #ddd;
    --middle-width: 800px;

}

/*基本設定：フォントサイズ*/
/*スマートフォンサイズ*/
@media(max-width:599px){
	:root{
		font-size:14px;		
	}
	
}
/*タブレットサイズ*/
@media(min-width:600px)and(max-width:799px){
	:root{
		font-size:16px;	
	}
	
}
/*PCサイズ*/
@media(min-width:800px){
	:root{
		font-size:18px;	
	}
	
}





/*基本設定：ページ全体*/
body{
	margin: 0;
	font-family: "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 15px;
	
}

/*ヘッダーA：サイト名*/
.headA{
	display:inline-block;
	line-height:100px;
	padding-left:20px;
	padding-right:20px;
	background-color:#C75558;
	background-color:var(--main-color);
	color:#fff;
	color:var(--text-bright-color);
	font-family: 'Great Vibes', cursive;
	font-family: 'Bad Script', cursive;
	font-family: 'Playball', cursive;

	font-size:24px;
	text-decoration:none;	
}

/*ヘッダー*/
header{
	position:absolute;
	top:0;
	left:0;
	z-index:100;
	width:100%;
   background-color: rgba(99, 9, 15, 0.25);
	
}

.nohero header{
	position:static;
	border-bottom:solid 1px #ddd;
	border-bottom:solid 1px var(--gray-color);
}


/*ヘッダーB：ナビゲーションメニュー*/

.headB ul{
	margin:0;
	padding:0;
	list-style:none;
		
}

.headB ul a{
display:block;
	padding:5px;
	color:#FFF;
	font-size:14px;
	text-decoration:none;
	
}


.headB a:hover{
	background-color:rgba(0,0,0,0.3);		
	
}

.headB h2{
	font-family: 'Great Vibes', cursive;
	font-family: 'Bad Script', cursive;
	font-family: 'Playball', cursive;
	font-family: 'Sigmar One', cursive;
	font-family: 'Walter Turncoat', cursive;
	font-family: 'Fugaz One', cursive;
	font-size:14px;	
}

/*==============================
st-Header 
==============================*/

body {
	overflow: auto;
}

body.active {
	overflow: hidden;
}

#headerScroll {
    transform: translateY(-100%);
    transition: 1s all;
}

#headerScroll.open {
    transform: translateY(0);
}

.st-Header * {
	padding: 0;
	margin: 0;
}

.st-Header .br767 {
	display: none;
}

.st-Header ul {
	list-style: none;
}

.st-Header a {
	color: #333333;
	text-decoration: none;
}

.st-Header {
	position: fixed;
}

.st-Header .inner {
	padding: 0 30px;
}

.st-Header .pc-Container {
	display: flex;
	align-items: center;
}

.st-Header .logo {
	max-width: 230px;
	font-size: 0;
}

.st-Header .logo img {
	width: 100%;
	height: auto;
}

.st-Header .menu-Col {
	margin-left: auto;
}

.st-Header .top-Box {
	display: flex;
	align-items: stretch;
	justify-content: flex-end;
}

.st-Header .top-Box > div {
	display: flex;
	align-items: stretch;
}

.st-Header .top-Box > div + div {
	margin-left: 20px;
}

.st-Header .top-Box > div a {
	display: flex;
	color: #ffffff;
	align-items: center;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	padding: 10px 0;
	transition: .6s all;
}

.st-Header .tel-Btn a {
	width: 240px;
	background-color: #ec6b6f;
	justify-content: center;
}

.st-Header .tel-Btn a:hover {
	background-color: #910063;
}

.st-Header .tel-Btn a dl {
	line-height: 1.4;
}

.st-Header .tel-Btn a dt {
	font-size: 95%;
}

.st-Header .tel-Btn a dd {
	font-size: 150%;
	font-weight: bold;
	padding-left: 30px;
	position: relative;
}

.st-Header .tel-Btn a dd::before {
	content: "";
	display: block;
	width: 25px;
	height: 16px;
	background-image: url(img/dial_icon.png);
	background-size: cover;
	background-position: center;
	position: absolute;
	top: 5px;
	left: 0;
	z-index: 1;
}

.st-Header .free-Btn a {
	width: 240px;
	font-size: 125%;
	font-weight: bold;
	background-color: #ec6b6f;
	justify-content: center;
}

.st-Header .free-Btn a:hover {
	background-color: #910063;
}

.st-Header .biz-Btn a {
	width: 230px;
	text-align: center;
	background-color: #235b87;
	justify-content: center;
}

.st-Header .biz-Btn a:hover {
	background-color: #1c90ef;
}

.st-Header .biz-Btn p {
	font-size: 110%;
	font-weight: bold;
}

.st-Header .biz-Btn p span {
	display: block;
	font-size: 85%;
}

.st-Header .corpo-Btn a {
	width: 130px;
	font-size: 100%;
	font-weight: bold;
	background-color: #1b9691;
	justify-content: center;
}

.st-Header .corpo-Btn a:hover {
	background-color: #00514e;
}

.st-Header .bottom-Box {
	padding-top: 10px;
}

/*------main-Navi------*/

.main-Navi > ul {
	display: flex;
	justify-content: flex-end
}

.main-Navi ul li {
	position: relative;
}

.main-Navi ul li a {
	display: inline-block;
	color: #ffffff;
	font-size: 105%;
	font-weight: bold;
	padding: 10px 15px;
	box-sizing: border-box;
	transition: .6s all;
}

.main-Navi ul li a:hover {
	color: #ec6b6f;
	background-color: #ffffff;
}

.main-Navi ul .sub-Navi span {
	display: inline-block;
	color: #ffffff;
	font-size: 105%;
	font-weight: bold;
	padding: 10px 30px 10px 15px;
	cursor: pointer;
	position: relative;
	transition: .6s all;
}

.main-Navi ul .sub-Navi span:hover {
	color: #ec6b6f;
	background-color: #ffffff;
}

.main-Navi ul .sub-Navi span::before {
	content: "";
	display: block;
	width: 5px;
	height: 5px;
	border-right: 3px solid #ffffff;
	border-bottom: 3px solid #ffffff;
	position: absolute;
	top: 16px;
	right: 15px;
	transform: rotate(45deg);
	z-index: 1;
	transition: .6s all;
}

.main-Navi ul .sub-Navi span:hover::before {
	border-right: 3px solid #ec6b6f;
	border-bottom: 3px solid #ec6b6f;
}

.main-Navi ul .sub-Navi span.active {
	color: #ec6b6f;
	background-color: #ffffff;
}

.main-Navi ul .sub-Navi span.active::before {
	border-right: 3px solid #ec6b6f;
	border-bottom: 3px solid #ec6b6f;
}

.main-Navi ul .sub-Navi ul {
	width: 280px;
	background-color: #ffffff;
	padding: 20px;
	box-sizing: border-box;
	box-shadow: 2px 2px 5px #bdbdbd;
	position: absolute;
	top: 44px;
	left: 0px;
	opacity: 0;
	z-index: 1;
	visibility: hidden;
	transition: .6s all;
}

.main-Navi ul .sub-Navi ul.active {
	visibility: visible;
	opacity: 1;
}

.main-Navi ul .sub-Navi ul li {
	margin-left: 0;
}

.main-Navi ul .sub-Navi ul li + li {
	margin-top: 20px;
}

.main-Navi ul .sub-Navi ul li a {
	display: inline;
	color: #333333;
	font-size: 110%;
	padding: 0 0 0 20px;
	position: relative;
	transition: none;
}

.main-Navi ul .sub-Navi ul li a:hover {
	color: #ec6b6f;
	background-color: transparent;
	text-decoration: underline;
}

.main-Navi ul .sub-Navi ul li a::before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-left: 6px solid #ec6b6f;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	position: absolute;
	top: 4px;
	left: 0;
	z-index: 1;
}


/*------toggle------*/

.st-Header .toggle {
	display: none;
	width: 70px;
	height: 70px;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 9999;
}

.st-Header .toggle span {
	display: block;
	width: 46px;
	height: 3px;
	background-color: #333333;
	border-radius: 10px;
	position: absolute;
	right: 0;
	left: 0;
	margin: auto;
	transition: .6s all;
	z-index: 999;
}

.st-Header .toggle span:nth-of-type(1) {
	top: 19px;
}

.st-Header .toggle.active span:nth-of-type(1) {
	top: 33px;
	transform: rotate(45deg);
}

.st-Header .toggle span:nth-of-type(2) {
	top: 0;
	bottom: 0;
}

.st-Header .toggle.active span:nth-of-type(2) {
	opacity: 0;
}

.st-Header .toggle span:nth-of-type(3) {
	top: 48px;
}

.st-Header .toggle.active span:nth-of-type(3) {
	top: 33px;
	transform: rotate(-45deg);
}

/*------sp-Container------*/

.sp-Container {
	display: none;
	max-width: 420px;
    width: 100%;
    height: 100vh;
    background-color: #ec6b6f;
    overflow: auto;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 9998;
	transform: translateX(100%);
    transition: .6s all;
}

.sp-Container .outer {
	padding: 80px 30px;
}

.sp-Container .sp-Logo {
	max-width: 260px;
	font-size: 0;
	margin: 0 auto 40px;
}

.sp-Container .sp-Logo img {
	width: 100%;
	height: auto;
}

.sp-Container .sp-Main li {
	position: relative;
}

.sp-Container .sp-Main > li {
	border-bottom: 1px dashed #ffffff;
	padding-left: 30px;
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.sp-Container .sp-Main > li::before {
	content: "";
    display: block;
    width: 20px;
    height: 20px;
    background-color: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: 5px;
    left: 0;
    z-index: 1;
}

.sp-Container .sp-Main > li::after {
    content: "";
    display: block;
    width: 5px;
    height: 5px;
    border-top: 2px solid #ec6b6f;
    border-right: 2px solid #ec6b6f;
    position: absolute;
    top: 11px;
    left: 5px;
    transform: rotate(45deg);
    z-index: 1;
}

.sp-Container ul li a {
	display: block;
	color: #ffffff;
	font-size: 145%;
	font-weight: bold;
}

.sp-Container ul li span {
	display: block;
	color: #ffffff;
	font-size: 145%;
	font-weight: bold;
}

.sp-Container .sub-Navi li {
	padding-top: 20px;
	padding-left: 20px;
}

.sp-Container .sub-Navi li::before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-left: 6px solid #ffffff;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	position: absolute;
	top: 28px;
	left: 0;
	z-index: 1;
}

.sp-Container .btn-Box {
	margin-top: 40px;
}

.sp-Container .p-Btn a {
	display: block;
	max-width: 320px;
	color: #ffffff;
	font-size: 120%;
	font-weight: bold;
	text-align: center;
	background-color: #b33d41;
	border: 3px solid #ffffff;
	border-radius: 5px;
	padding: 15px 0;
	margin: 0 auto;
}

.sp-Container .p-Btn a span {
	display: block;
	font-size: 100%;
}

.sp-Container .p-Btn a b {
	font-size: 140%;
	padding-left: 30px;
	position: relative;
}

.sp-Container .p-Btn a b::before {
	content: "";
    display: block;
    width: 25px;
    height: 16px;
    background-image: url(img/dial_icon.png);
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 10px;
    left: 0;
    z-index: 1;
}

.sp-Container .t-Btn {
	margin-top: 20px;
}

.sp-Container .t-Btn a {
	display: block;
	max-width: 320px;
	color: #ffffff;
	font-size: 120%;
	font-weight: bold;
	text-align: center;
	background-color: #721CB2;
	border: 3px solid #ffffff;
	border-radius: 5px;
	padding: 30px 0;
	margin: 0 auto;
}

.sp-Container .c-Btn {
	margin-top: 20px;
}

.sp-Container .c-Btn a {
	display: block;
	max-width: 320px;
	color: #ffffff;
	font-size: 120%;
	font-weight: bold;
	text-align: center;
	background-color: #677FB2;
	border: 3px solid #ffffff;
	border-radius: 5px;
	padding: 30px 0;
	margin: 0 auto;
}

.sp-Container .other-Link {
	border-top: 1px solid #ffffff;
    margin-top: 30px;
    padding-top: 30px;
}

.sp-Container .b-Btn a {
	display: block;
	max-width: 320px;
	color: #ffffff;
	font-size: 130%;
	font-weight: bold;
	text-align: center;
	border: 4px solid #1c90ef;
	background-image: url(img/bb_bg.jpg);
	background-size: cover;
	background-position: center;
	border-radius: 5px;
	padding: 20px 0;
	margin: 0 auto;
	position: relative;
}

.sp-Container .b-Btn a::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(9, 91, 155, 0.7);
	border-radius: 5px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}

.sp-Container .b-Btn a b {
	display: block;
	position: relative;
	z-index: 2;
}

.sp-Container .b-Btn a span {
	display: block;
	font-size: 80%;
}

.sp-Container .co-Btn {
	margin-top: 20px;
}

.sp-Container .co-Btn a {
	display: block;
	max-width: 320px;
	color: #ffffff;
	font-size: 140%;
	font-weight: bold;
	text-align: center;
	background-color: #1b9691;
	border-radius: 5px;
	padding: 20px 0;
	margin: 0 auto;
	position: relative;
}

.sp-Container .co-Btn a span {
	display: block;
	font-size: 80%;
}



@media screen and (max-width:1279px) {
	
	.st-Header .inner {
		padding: 0 20px;
	}

	.st-Header .top-Box > div + div {
		margin-left: 10px;
	}

	.st-Header .tel-Btn a {
		width: 230px;
	}

	.st-Header .tel-Btn a dt {
		font-size: 90%;
	}

	.st-Header .tel-Btn a dd {
		font-size: 140%;
		padding-left: 25px;
	}

	.st-Header .tel-Btn a dd::before {
		width: 20px;
		height: 14px;
		top: 6px;
	}

	.st-Header .free-Btn a {
		width: 220px;
		font-size: 120%;
	}

	.st-Header .biz-Btn a {
		width: 200px;
	}

	.st-Header .biz-Btn p {
		font-size: 100%;
	}

	/*------main-Navi------*/

	.main-Navi ul li a {
		font-size: 100%;
		padding: 10px;
	}

	.main-Navi ul .sub-Navi span {
		font-size: 100%;
		padding: 10px 25px 10px 10px;
	}

	.main-Navi ul .sub-Navi span::before {
		right: 8px;
	}

}

@media screen and (max-width:1139px) {

	.st-Header .inner {
        padding: 0;
    }

	.st-Header .logo {
		max-width: auto;
		height: 70px;
	}

	.st-Header .logo img {
		width: auto;
		height: 100%;
	}

	.st-Header .top-Box {
		padding-right: 80px;
	}

	.st-Header .top-Box.active {
		display: none;
	}

	.st-Header .top-Box .biz-Btn {
		display: none;
	}

	.st-Header .top-Box .corpo-Btn {
		display: none;
	}

	.st-Header .bottom-Box {
		display: none;
	}

	/*------toggle------*/

	.st-Header .toggle {
		display: block;
	}

	/*------sp-Container------*/

	.sp-Container {
		display: block;
	}

	.sp-Container.active {
		transform: translateX(0);
	}

}

@media screen and (max-width:767px) {

	#headerScroll {
		transform: translateY(0);
	}

	.st-Header .br767 {
		display: block;
	}

	.st-Header .top-Box .tel-Btn {
		display: none;
	}

	.st-Header .top-Box .free-Btn a {
        width: 110px;
        font-size: 100%;
        text-align: center;
        padding: 12px 0;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }

	/*------sp-Container------*/

	.sp-Container {
		max-width: 100%;
	}

}



/*コンテンツA：ヒーローイメージ*/
.conA{
	text-align:center;
	background-image:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2)),url(img/fruits.jpg);
	background-position:center;
	background-size:cover;
	height:80vh;
	min-height:450px;
	display:flex;
	align-items:center;
	justify-content:center;

	color:var(--text-birght-color);
	
	position: relative;
	
}



.conA.compact{
	position: relative;
	min-height:0;
}

.cad_img {
	height: 70vh;
	min-height:0;
	background-image:url(img/cadtop.jpg);
}

.web_img {
	height: 70vh;
	min-height:0;
	background-image:url(img/webtop.jpg);
}

.robo_img {
	height: 70vh;
	min-height:0;
	background-image:url(img/robotop.jpg);
}

.office_img {
	height: 70vh;
	min-height:0;
	background-image:url(img/officetop.jpg);
}

.cg_img {
	height: 70vh;
	min-height:0;
	background-image:url(img/cgtop.jpg);
}

.dtp_img {
	height: 70vh;
	min-height:0;
	background-image:url(img/dtptop.jpg);
}

.school_img {
	height: 70vh;
	min-height:0;
	background-image:url(img/schooltop.jpg);
}




.conA h1{
	margin-top:0;
	margin-bottom:10px;
	font-size:12vw;
font-family: 'Great Vibes', cursive;
font-family: 'Bad Script', cursive;
font-family: 'Playball', cursive;
font-family: 'Sigmar One', cursive;
font-family: 'Walter Turncoat', cursive;
font-family: 'Fugaz One', cursive;

letter-spacing:0.1em;
margin-left:0.1em;
	color:var(--text-bright-color);

    color: #910063;	
}






.conA img{
	width:20%;	
}


.conA a{
	
	display:block;
	text-decoration:none;
	color:#fff;	
		
	
}


.conA p{
	margin-top:0;
	margin-bottom:0;
	font-size:4vw;
 color: #453700;
	
}


/*コンテンツB：アイコン+テキスト*/
.conB .container{
	padding-top:80px;
	padding-bottom:20px;	
	
}

.conB .text{
	text-align:center;	
	padding-left:20px;
	padding-right:20px;
	padding-bottom:60px;
	
}


.conB h2{
	margin-top: 80px;
	margin-bottom: 10px;
	font-size: 20px;
}

.comB p{
		margin-top:0px;
		margin-bottom:20px;
		font-size:14px;
		line-height:1.8em;
		opacity:0.8;	
	
}

.conB a{
	color:#5d9ab2;
	color:var(--main-color);
	text-decoration:none;	
}


.conB a:hover{
	text-decoration:underline;	
	
}


.conB .icon{
	display:inline-block;
	margin-bottom:20px;
	font-size:40px;
	width:2em;
	line-height:2em;
	border-radius:50%;
	text-align:center;
	background-color:#ddd;
	background-color:var(--icon-bk-color);
	color:#FFF;
	color:var(--icon-color);	
	
	
}



/*コンテンツC：概要（画像+テキスト）*/
.conC{
	background-color:#9dc651;
	background-color:var(--main-color);
	color:#fff;
	color:var(--text-bright-color);	
	
}


.conC h2{
		margin-top:0px;
		margin-bottom:10px;
		font-size:20px;
}

.comC p{
		margin-top:0px;
		margin-bottom:20px;
		font-size:14px;
		line-height:1.8em;
		opacity:0.8;	
	
}

.conC a{
	
	display:inline-block;
	margin-top:20px;
	padding:10px 30px;
	border:solid 3px currentColor;
	border-radius:6px;
	background-color:#bf6a7a;
	background-color:var(--accent-color);
	color:#fff;
	color:var(--text-bright-color);
	font-size:14px;
	text-decoration:none;	
	
}

.conC a:hover{
		background-image:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
		
		
}

.conC .photo{
	min-height:200px;
	background-image:url(img/note.jpg);
	background-position:center;
	background-size:cover;
		
}

.conC .text{
	padding:20px;	
}





/*コンテンツC-2：概要（画像+テキスト）*/
.conC-2{
	background-color:#5d9ab2;
	background-color:var(--main-color);
	color:#fff;
	color:var(--text-bright-color);	
	
}


.conC-2 h2{
		margin-top:0px;
		margin-bottom:10px;
		font-size:20px;
}

.comC-2 p{
		margin-top:0px;
		margin-bottom:20px;
		font-size:14px;
		line-height:1.8em;
		opacity:0.8;	
	
}

.conC-2 a{
	
	display:inline-block;
	margin-top:20px;
	padding:10px 30px;
	border:solid 3px currentColor;
	border-radius:6px;
	background-color:#bf6a7a;
	background-color:var(--accent-color);
	color:#fff;
	color:var(--text-bright-color);
	font-size:14px;
	text-decoration:none;	
	
}

.conC-2 a:hover{
		background-image:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
		
		
}

.conC-2 .photo{
	min-height:200px;
	background-image:url(img/office.jpg);
	background-position:center;
	background-size:cover;
		
}

.conC-2 .text{
	padding:20px;	
}






/*コンテンツD：概要（画像+テキスト:逆配置）*/
.conD .container{
	padding-top:2px;	
}

.conD h2{
		margin-top:0px;
		margin-bottom:10px;
		font-size:20px;
}

.comD p{
		margin-top:0px;
		margin-bottom:20px;
		font-size:14px;
		line-height:1.8em;
		opacity:0.8;	
	
}

.conD a{
	
	display:inline-block;
	margin-top:20px;
	padding:10px 30px;
	box-shadow:0 0 0 1px #888;
	border:solid 3px currentColor;
	border-radius:6px;
	background-color:#bf6a7a;
	background-color:var(--accent-color);
	color:#fff;
	color:var(--text-bright-color);
	font-size:14px;
	text-decoration:none;	
	
}

.conD a:hover{
		background-image:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
		
		
}

.conD .photo{
	min-height:200px;
	background-image:url(img/first.jpg);
	background-position:center;
	background-size:cover;
		
}

.conD .text{
	padding:20px;	
}

/*コンテンツD-2：概要（画像+テキスト:逆配置）*/
.conD-2 .container{
	padding-top:2px;	
}

.conD-2 h2{
		margin-top:0px;
		margin-bottom:10px;
		font-size:20px;
}

.comD-2 p{
		margin-top:0px;
		margin-bottom:20px;
		font-size:14px;
		line-height:1.8em;
		opacity:0.8;	
	
}

.conD-2 a{
	
	display:inline-block;
	margin-top:20px;
	padding:10px 30px;
	box-shadow:0 0 0 1px #888;
	border:solid 3px currentColor;
	border-radius:6px;
	background-color:#bf6a7a;
	background-color:var(--accent-color);
	color:#fff;
	color:var(--text-bright-color);
	font-size:14px;
	text-decoration:none;	
	
}

.conD-2 a:hover{
		background-image:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
		
		
}

.conD-2 .photo{
	min-height:200px;
	background-image:url(img/dtp.jpg);
	background-position:center;
	background-size:cover;
		
}

.conD-2 .text{
	padding:20px;	
}


/*コンテンツE：概要（画像+テキスト:背景付）*/
.conE{
	background-color:#bf6a7a;
	background-color:var(--accent-color);	
}
.conE .container{
	padding-top:2px;	
}

.conE h2{
		margin-top:0px;
		margin-bottom:10px;
		font-size:20px;
}

.comE p{
		margin-top:0px;
		margin-bottom:20px;
		font-size:14px;
		line-height:1.8em;
		opacity:0.8;	
	
}

.conE a{
	
	display:inline-block;
	margin-top:20px;
	padding:10px 30px;
	box-shadow:0 0 0 1px #888;
	border:solid 3px currentColor;
	border-radius:6px;
	background-color:#bf6a7a;
	background-color:var(--accent-color);
	color:#fff;
	color:var(--text-bright-color);
	font-size:14px;
	text-decoration:none;	
	
}

.conE a:hover{
		background-image:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
		
		
}

.conE .photo{
	min-height:200px;
	background-image:url(img/life.jpg);
	background-position:center;
	background-size:cover;
		
}

.conE .text{
	padding:20px;	
}

/*コンテンツF：概要（背景画像+テキスト）*/
.conF{
	background-image:url(img/web.jpg);
	background-position:center;
	background-size:cover;
	background-attachment: scroll;
}
.conF .container{
	padding-top:2px;	
}

.conF h2{
		margin-top:0px;
		margin-bottom:10px;
		font-size:20px;
}

.comF p{
		margin-top:0px;
		margin-bottom:20px;
		font-size:14px;
		line-height:1.8em;
		opacity:0.8;	
	
}

.conF a{
	display:inline-block;
	margin-top:20px;
	padding:10px 30px;
	box-shadow:0 0 0 1px #888;
	border:solid 3px currentColor;
	border-radius:6px;
	background-color:#bf6a7a;
	background-color:var(--accent-color);
	color:#fff;
	color:var(--text-bright-color);
	font-size:14px;
	text-decoration:none;	
	
}

.conF a:hover{
		background-image:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
		
		
}

.conF .photo{
	min-height:200px;
	background-image:none;
	background-position:center;
	background-size:cover;	
}

.conF .text{
	padding:20px;
	background-color:rgba(255,255,255,0.7);	
}



/*コンテンツF-2：概要（背景画像+テキスト）*/
.conF-2{
	background-image:url(img/cg.jpg);
	background-position:center;
	background-size:cover;
	background-attachment: scroll;
}
.conF-2 .container{
	padding-top:2px;	
}

.conF-2 h2{
		margin-top:0px;
		margin-bottom:10px;
		font-size:20px;
}

.comF-2 p{
		margin-top:0px;
		margin-bottom:20px;
		font-size:14px;
		line-height:1.8em;
		opacity:0.8;	
	
}

.conF-2 a{
	display:inline-block;
	margin-top:20px;
	padding:10px 30px;
	box-shadow:0 0 0 1px #888;
	border:solid 3px currentColor;
	border-radius:6px;
	background-color:#bf6a7a;
	background-color:var(--accent-color);
	color:#fff;
	color:var(--text-bright-color);
	font-size:14px;
	text-decoration:none;	
	
}

.conF-2 a:hover{
		background-image:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
		
		}

.conF-2 .photo{
	min-height:200px;
	background-image:none;
	background-position:center;
	background-size:cover;	
}

.conF-2 .text{
	padding:20px;
	background-color:rgba(255,255,255,0.7);	
}




/*フッター*/
footer{
    color: #fff;
    color: var(--text-bright-color);
    background-color: var(--dark-main-color);
background-color: rgba(49, 1, 59, 0.85);
}

footer .container{
	padding:40px 20px;	
	
}



/*フッターA：サイト情報*/
.footA{
	margin-bottom:30px;	
	
}

.footA h2{
	margin-top:0;
	margin-bottom:10px;
	font-size:30px;
	font-family: 'Great Vibes', cursive;
	font-family: 'Bad Script', cursive;
	font-family: 'Playball', cursive;
	font-family: 'Sigmar One', cursive;
	font-family: 'Walter Turncoat', cursive;
	font-family: 'Fugaz One', cursive;
	letter-spacing:0.1em;
		
}

.footA p{
	margin-top:0;
	margin-bottom:0;
	font-size:14px;	
	
}

.footA a{
	color:inherit;
	text-decoration:none;	
	
}

/*フッターB：サイトメニュー*/
.footB div{
	margin-bottom:20px;	
	
}

.footB h3{
	margin-top:0;
	margin-bottom:10px;
	border-bottom:solid 1px currentColor;
	font-size:14px;
		
}

.footB ul{
	margin:0;
	padding:0;
	list-style:none;
		
}

.footB a{
	display:block;
	padding:5px;
	color:inherit;
	font-size:12px;
	text-decoration:none;
	
}


.footB a:hover{
	background-color:rgba(0,0,0,0.3);		
	
}

/*フッターC：コピーライト*/
.footC{
	font-size:12px;
	text-align:center;
	font-family: 'Great Vibes', cursive;
	font-family: 'Bad Script', cursive;
	font-family: 'Playball', cursive;
	font-family: 'Sigmar One', cursive;
	font-family: 'Walter Turncoat', cursive;
	font-family: 'Fugaz One', cursive;
	letter-spacing:0.1em;	
}


/*フッターD：SNSメニュー*/
.footD{
	margin-top:20px;	
	
}

.footD ul{
	display:flex;
	margin:0;
	padding:0;
	list-style:none;
		
}

.footD a{
	display:block;
	padding:0px;
	color:inherit;
	font-size:16px;
	text-decoration:none;
	border:solid 1px currentColor;
	width:2em;
	lige-height:2em;
	border-radius:50%;
	text-align:center;
	margin-right:8px;
	
	
}


.footD a:hover{
	background-color:rgba(0,0,0,0.3);		
	
}


	/*コンテンツページ:記事*/
.post .container{
	max-width:800px;
	max-width:var(--middle-width);
	margin-left:auto;
	margin-right:auto;
	padding:30px 10px;	
}

.post h1{
	font-size:2rem;	
	padding-left:0.5rem;
	border-left:solid 0.75rem #bf6a7a;
	border-left:solid 0.75rem var(--accent-color);
	font-size:2rem;
}

.post p{
	font-size:1rem;
	line-height:2;	
}

.post img{
	max-width:100%;	
}


/*コンテンツページ：パンくずリスト*/
.bread ol{
	margin:0;
	padding:0;
	list-style:none;
	display:flex;
		
}

.bread a{
	display:block;
	padding:5px;
	color:inherit;
	font-size:0.875rem;
	text-decoration:none;
	
}


.bread a:hover{
	background-color:rgba(0,0,0,0.3);		
	
}

.bread a::after{
	margin-left:10px;
	content:'\f054';
	font-family:'FontAwesome';
	opacity:0.3;	
	
}

/*アバウトページ：画層と沿革*/
.history{
	background-color:#5d9ab2;
	background-color:var(--main-color);
	color:#fff;
	color:var(--text-bright-color);	
	
}

.history .text{
	padding:20px;	
}


.history h2{
		margin-top:0px;
		margin-bottom:10px;
		font-size:1.5rem;
}

.history .photo{
	min-height:300px;
	background-image:url(img/plant.jpg);
	background-position:center;
	background-size:cover;
		
}

.history table{
	border-collapse:collapse;
	border-top:solid 1px #ddd;
	border-top:solid 1px var(--gray-color);	
	font-size:0.875rem;
	
}

.history th,
.history td{
	border-bottom:solid 1px #ddd;
	bprder-bottom:solid 1px var(--gray-color);	
	padding-top:1.8rem;
	padding-bottom:1.8rem;
}

.history th{
	padding-right:1rem;
	text-align:left;
	word-break:keep-all;	
	
}

/*お問い合わせページ：問い合わせ先*/

.contact{
	margin-top:20px;
	margin-bottom:20px;
	padding:20px;
	border:solid 1px #ddd;
	border:solid 1px var(--gray-color);
	text-align:center;	
	
}

.contact h2{
	margin-top:0;
	font-size:1.2rem;
	
}

.contact span{
	display:inline-block;
	margin-bottom:20px;
	font-size:2.2rem;
	width:2em;
	border-radius:50%;
	text-align:center;
	background-color:#5d9ab2;
	background-color:var(--main-color);
	color:#fff;
	color:var(--icon-color);		
	
}

.contact a{
	font-size:1.4rem;
	color:inherit;
	text-decoration:none;
		
}


/*お問い合わせページ：地図*/
.location iframe{
	width:100%;
	height:400px;
	vertical-align:bottom;	
	
}

.location h2{
	margin:0;
	padding-top:20px;
	background-color:#5d9ab2;
	background-color:var(--main-color);
	color:#fff;
	color:var(--text-bright-color);
	font-size:1.5rem;
	text-align:center;	
	
}


/*アレンジ：ヘッダーを画面上部に固定*/
.head-fixed,
.nohero .head-fixed{
	position:fixed;	
}

.nohero .head-fixed + * {
 margin-top:70px;	
	
}


/*記事一覧A*/
.listA h1{
	text-align:center;	
}

.listA h2{
	font-size:18px;
}

.listA p{
	font-size:14px;
	opacity:0.8;	
}

.listA .photo{
	min-height:150px;
	background-position:center;
	background-size:cover;	
}

.listA a{
	margin:10px;
	display:block;
	border:solid 1px #ddd;
	border:solid 1px var(--gray-color);
	color:inherit;
	text-decoration:none;
	flex:1;	
}

.listA a:hover{
	opacity:0.8;
}

.listA .text{
	margin:10px;	
}

.listA .container{
	display:flex;
	flex-wrap:wrap;	
	max-width:1000px;
	max-width:var(--large-width);
	margin:30px auto;
	
}

.listA article{
	flex:1 1 300px;	
	display:flex;
		
}



/*記事一覧B*/
.listB h1{
	text-align:center;	
}

.listB h2{
	font-size: 20px;
	margin-top: 6%;
	width: 100%;
}

.listB p{
	font-size:14px;
	opacity:0.8;
	padding-left:8px;
	padding-right:8px;
	line-height:1.6em;	
}
	
.listB .price p{
	font-size:14px;
	opacity:0.8;
	font-weight:bold;	
}

.listB .photo{
	min-height:80px;
	background-position:center;
	background-size:cover;
	flex:2;
 	min-width:50px;
}

.listB a{
	margin:10px;
	display:flex;
	border:solid 1px #ddd;
	border:solid 1px var(--gray-color);
	color:inherit;
	text-decoration:none;
	flex:1;	
}

.listB a:hover{
	opacity:0.8;
}

.listB .text{
	flex: 3;
	margin-right: 3px;
	margin-left: 6px;
}

.listB .container{
	display: flex;
	flex-wrap: wrap;
	max-width: 1000px;
	max-width: var(--large-width);
	margin-top: 20px;
	margin-right: auto;
	margin-bottom: 30px;
	margin-left: auto;
	
}

.listB article{
	flex:1 1 384px;	
	display:flex;
		
}


/*記事一覧C*/
.listC h1{
	text-align:center;	
}

.listC h2{
	font-size:18px;
	margin:0;
}

.listC p{
	font-size:14px;
	opacity:0.8;
	margin:0;	
}

.listC .photo{
	min-height:250px;
	background-position:center;
	background-size:cover;
	opacity:0.6;	
}

.listC a{
	margin:2px;
	display:block;
	border:solid 1px #ddd;
	border:solid 1px var(--gray-color);
	color:inherit;
	text-decoration:none;
	flex:1;	
	position:relative;
	background-color:currentColor;
}

.listC a:hover{
	opacity:0.8;
}

.listC .text{
	margin:10px;
	position:absolute;
	bottom:0;
	left:0;
	color:#fff;
	color:var(--text-bright-color);	
}

.listC .container{
	display:flex;
	flex-wrap:wrap;	
	max-width:none;
	margin:2px auto;
	
}

.listC article{
	flex:1 1 250px;	
	display:flex;
		
}



/*コース詳細ページ*/


.pagecontaner{
	
	max-width:1000px;
	width:100%;
	margin-left:auto;
	margin-right:auto;	
	
	
}




.main{
	max-width:1000px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
}

.main p{
	padding-left:10px;
	padding-right:10px;
	
	
	
}

table{
    width: 95%;
    background-color:#FBF2EF;
    margin-left: auto;
    margin-right: auto;
    border:#ffffff 2px solid;
    border-collapse: collapse;
    color: #444444;
    font-size: 95%;
    }

th{
	background-color:#F8E6E0;
    border:#ffffff 2px solid;
    border-collapse: collapse;
    padding: 5px; 
    padding-left: 6px;
    padding-right: 6px;
	}

td{
    border:#fff 2px solid;
    border-collapse: collapse;
    text-align: center;
    padding: 5px; 
    padding-left: 15px;
    padding-right: 15px;
	}

.haikei{
	display: block;
	background-image: linear-gradient(to left,#B26C5F,#f08080);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(Gradient Type=1,StartColorStr=#f08080,EndColorStr=#FBF2EF)";
	border-left: solid 20px #bf6a7a;
	text-align: center;
	color: #FFFFFF;
	margin-bottom: 40px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 7px;
	padding-bottom: 7px;
	letter-spacing: 0.1em;
	margin-top: 30px;
	box-sizing: border-box;
	}
    

.zumen{
	width:100%;
	display:block;
    margin: 0 auto;
	/*border-bottom:2px #999999 dotted ;*/
    }

.setumei{
	width: 95%;
	margin: 0 auto;
    }   
.left{
	margin-right:30px
    }
.chyuo{
	margin-right:30px;
    }
.box1{
	max-width: 485px;
	width: 100%;
	float: left;
	magin-right: 25px;
	margin-bottom: 20px;
    }
.box2{
	max-width:485px;
	width:100%;
	float:right;
    }
.box_s{
	float:left;
	margin-top:-25px;
    }
.box_s_right{
	float:right;
	margin-top:-25px;
	margin-right:25px;
    }

.big_box{
	width:100%;
	margin:  -bottom: 50px;
	}




.li_small{
	color:#666666;
	font-size:70%;
	list-style-type: none;
    }
   
.stepup{
    width:85%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    }


.course a{
 	text-decoration:none;
	border:none;
}

.button3 a {
	width: 260px;
	background-color: #f08080;
	border-radius: 3px;
	box-shadow: 0 3px 0 rgba(136,136,136,1);
	color: #ffffff;
	display: block;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	margin-left: auto;
	padding: 10px;
	margin-bottom: 40px;
}

.button3 a:hover {
  box-shadow: 0 1px 0 rgba(136,136,136,1);
  margin-left: auto;
}



.button{
	width:100%
	clear:both;
	margin: 0 auto;
	padding-top:20px;
    padding-bottom: 20px;
    }

.p_button{
    width:30%;
    display:block;
    text-align:center;
    padding:10px 0px;
    background-color:#C75558;
    border-radius:13px;
    letter-spacing:0.1em;
	float:left;
	margin-right:5%;
	}

.p_button_r{
	width:30%;
    display:block;
    text-align:center;
    padding:10px 0px;
    background-color:#C75558;
    border-radius:13px;
    letter-spacing:0.1em;
	}

.p_button a{
    color:#fff;
	}

.p_button a:hover {
    color: #F8E6E0;
    }

/*コースメインページ*/
.small{
	font-size:20%;
	}
	
article h3{
	font-size: 16.5px;
}

.price{
	font-size: 18px;
	
}

/*変更問題8*/

.otoiawase a{
 text-decoration:none;
 border:none;
 text-align:center;
}


.button a {
  width: 320px;
  background-color: #677FB2;
  border-radius: 3px;
  box-shadow: 0 3px 0 rgba(136,136,136,1);
  color: #ffffff;
  display: block;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  margin: 10px auto;
  padding: 30px;
}
.button a:hover {
  box-shadow: 0 1px 0 rgba(136,136,136,1);
  margin: 12px auto 8px;
}
.button2 a {
  width: 320px;
  background-color: #721CB2;
  border-radius: 3px;
  box-shadow: 0 3px 0 rgba(136,136,136,1);
  color: #ffffff;
  display: block;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  margin: 10px auto;
  margin-top:29px;
  padding: 30px;
}
.button2 a:hover {
  box-shadow: 0 1px 0 rgba(136,136,136,1);
  margin: 30px auto 8px;
}


/* アレンジ: 関連記事メニュー */
.related {
	background-color: #5D9AB2;
	background-color: var(--main-color);
	padding: 30px;
		
}

.related ul {
	display: flex;
	flex-wrap: wrap;
	max-width: 1000px;
	max-width: var(--large-width);
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

.related li {
	flex: 1 1 100%;
	display: flex;
}

.relateda {
	flex: 1;

	display: block;
	border: solid 1px #ddd;
	border: solid 1px var(--gray-color);
	background-color: rgba(255,255,255,0.5);
	color: inherit;
	text-decoration: none;
	
}
.related a{
 text-decoration:none;
 color:#333;
}
.related a:hover {
	opacity: 0.8;
	text-align: center;
}

.related .photo {
	min-height: 100px;
	background-position: center;
	background-size: cover;
}

.related .text {
	margin: 10px;
}

.related h2 {
	font-size: 18px;
}

.related p {
	font-size: 14px;
	opacity: 0.8;
}


/*shadeリンク*/

.shade a{
	margin-top:100px;
	margin-right:50px;
}



	/*スクール案内ページ*/
.h1_line{

	width: auto;
	background-image: linear-gradient(to left,#B26C5F,#f08080);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(Gradient Type=1,StartColorStr=#f08080,EndColorStr=#FBF2EF)";
	border-left: solid 20px #bf6a7a;
	text-align: center;
	color: #FFFFFF;
	margin-bottom: 50px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 5px;
	padding-bottom: 5px;
	letter-spacing: 0.15em;
	margin-top: 30px;
	font-size: 160%;
	
}
	
.h2_line{
	border-bottom:#f08080 dotted 4px;
	margin-top:80px;
	color:#B26C5F;
	text-align:center;
	font-size:22px;
	letter-spacing:0.1em;
	clear:both
	}
	
.h2_title{
	border-bottom:#f08080 dotted 4px;
	margin-top:80px;
	color:#B26C5F;
	text-align:left;
	letter-spacing:0.1em;
	padding-left:20px;
	padding-right:15px;
}
	
	
.h3_1{
	font-size:130%;
	margin-top:60px;
	letter-spacing:0.1em;
	padding-left:8px;
	padding-right:8px;
}

.h3_2{
	margin-top:50px;
	margin-bottom:30px;
}
.h4{
	margin-bottom:-15px;
	font-size:105%;
}
.circle_q{
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #5f5f5f;
  text-align:center;
  line-height: 50px;
  vertical-align: middle;
  color: #fff;
  margin-right:10px;
  margin-left:10px;
}

.aaa{
	color: #f08080; 
	font-size:130%; 
	font-weight:bold; 
	margin-right:10px;
}
.name{
	border-bottom:dotted #f08080 1px;
}

.name2{
	background-color:#B26C5F;
	padding:5px 15px;
	color: #fff;
	letter-spacing:0.15em;
	border-radius:5px;
}

table{
	margin-left: auto;
	margin-right: auto;
	width:85%;
}

.td{
	text-align: center;
}
.td_2{
	padding:20px;
}
.p_line{
	padding-top:10px;
	border-bottom:dotted #f08080 1px;
}
.silhouette{
	float:right;
	margin:0px 40px 10px 10px;

}

.silhouette2{

	margin:0px 40px 10px 10px;

}

.hito{
	color:#666666;
	float: right;
    font-size:90%;
	padding-bottom:-20px;
}

.Question{
	font-size:105%;
	color:#002055;
	font-weight:bold;
	margin-bottom:8px;
}
dt {
    font-weight: bold;
}
dd{
	margin-bottom:20px;
}


.table_hp{
	border-collapse : collapse ;
	border:dotted #f08080 1px;
	margin:30px auto 20px;
}
	
.td_hp{
	border-collapse : collapse ;
	border:dotted #f08080 1px;
	padding:5px 5px;
}

.tr_hp{
	border:dotted #f08080 1px;
	border-collapse : collapse ;
}

.th_hp{
	border-collapse : collapse ;
	border:dotted #f08080 1px;
	padding:8px;
}
	

.mark{
	padding-right:15px;
	margin-bottom:-5px;
}

	



@media (min-width: 600px) and (max-width: 899px) {
	.related li {
		flex: 1 1 50%;
	}
    .otoiawase{
		width:90%;
	}
	h2{
	font-size:90%;
	}

}

@media (min-width: 900px) {
	.related li {
		flex: 1 1 25%;
	}
}

















@media(max-width:384px){
	/*記事一覧Bの概要をコンパクトにする*/
	.listB .photo{
		flex:1;		
	}
	.listB p{
		display:none;		
	}

.listB h2{
	font-size: 16px;
	margin-top: 40px;
	padding-left:0px;

justify-content:space-between;
}

.haikei{
	font-size: 90%;
}

	h2{
	font-size:85%;
	}

.otoiawase a{
 text-decoration:none;
 border:none;
 text-align:center;
}


.button a {
  width: 80%;
  background-color: #677FB2;
  border-radius: 3px;
  box-shadow: 0 3px 0 rgba(136,136,136,1);
  color: #ffffff;
  display: block;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  margin: 10px auto;
 
}
.button a:hover {
  box-shadow: 0 1px 0 rgba(136,136,136,1);
  margin: 12px auto 8px;
}
.button2 a {
  width:80%;
  background-color: #721CB2;
  border-radius: 3px;
  box-shadow: 0 3px 0 rgba(136,136,136,1);
  color: #ffffff;
  display: block;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  margin: 10px auto;
  margin-top:29px;

}
.button2 a:hover {
  box-shadow: 0 1px 0 rgba(136,136,136,1);
  margin: 30px auto 8px;
}


.button3 a {
	width: 240px;
	background-color: #f08080;
	border-radius: 3px;
	box-shadow: 0 3px 0 rgba(136,136,136,1);
	color: #ffffff;
	display: block;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	margin-left: auto;
	padding: 10px;
	margin-bottom: 40px;
}


.heromesaage{
	font-size:65%;	
}
.conA a{
	
	display:inline-block;
	margin-top:20px;
	padding:10px 10px;
	border:solid 3px currentColor;
	border-radius:6px;
	background-color:#bf6a7a;
	background-color:var(--accent-color);
width:85%;
	color:var(--text-bright-color);
	font-size:12px;
	text-decoration:none;
		color:#fff;	
	
}

.conA a:hover{
		background-image:linear-gradient(rgba(255,255,255,0.2),rgba(255,255,255,0.2));
		
		
}

.conB .text{
	text-align:center;	
	padding-left:20px;
	padding-right:20px;
	padding-bottom:20px;
	
}

.conB .container{
	padding-top:20px;
	padding-bottom:10px;	
	
}
.conB .icon{
	display:inline-block;
	margin-bottom:-40px;
	font-size:40px;
	width:2em;
	line-height:2em;
	border-radius:50%;
	text-align:center;
	background-color:#ddd;
	background-color:var(--icon-bk-color);
	color:#FFF;
	color:var(--icon-color);	
	
	
}

.conB h2{
margin-top:-20px;	
}


.headB ul{
	margin:0;
	padding:0;
	list-style:none;
		
}


.headB ul a{
display:block;
	padding:10px;
	color:#FFF;
	font-size:15px;
	text-decoration:none;
	text-align:center;
	
}


.headB a:hover{
	background-color:rgba(0,0,0,0.3);		
	
}

.headB h2{
	font-family: 'Great Vibes', cursive;
	font-family: 'Bad Script', cursive;
	font-family: 'Playball', cursive;
	font-family: 'Sigmar One', cursive;
	font-family: 'Walter Turncoat', cursive;
	font-family: 'Fugaz One', cursive;
	width: 66%;
    margin: 0 auto;
	
}

.headB img{
	width: 100%;	
}

.h3_1{
	font-size:90%;
	margin-top:20px;
	letter-spacing:0.1em;
	padding-left:8px;
	padding-right:8px;
}

.silhouette {
	float:right;
	margin:0px 20px 10px 10px;
	width:25%;
}
.silhouette2 {

	margin:0px 20px 10px 10px;
	width:90%;
}
table{
	margin-left: auto;
	margin-right: auto;
	width:85%;
}

.td{
	text-align: center;
}
.td_2{
	padding:3px;
}

.table_hp{
	border-collapse : collapse ;
	border:dotted #f08080 1px;
	margin:3px auto 3px;
}
	
.td_hp{
	border-collapse : collapse ;
	border:dotted #f08080 1px;
	padding:3px 3px;
}

.tr_hp{
	border:dotted #f08080 1px;
	border-collapse : collapse ;
}

.th_hp{
	border-collapse : collapse ;
	border:dotted #f08080 1px;
	padding:3px;
}

.mailif{
width:65%;	
	
}


}


@media(max-width:767px){
	/*トグルボタンの配置*/
	header .container-small{
		display:flex;
		align-items:center;
		justify-content:space-between;
	}
	
}

	.headB{
		display:none;	
		
	}
	
	h2{
	font-size:90%;
	}

.haikei{
	font-size: 130%;
	}

	/*トグルボタンのデザイン*/
	.headC{
		margin-right:10px;
		padding:0;
		border:none;
		outline:none;
		background:none;
		font-size:28px;
		opacity:0.5;
		cursor:pointer;	
		position: absolute;
		right: 0;
	}

	.headC:hover{
		opacity:0.3;	
	}
.heromesaage{
	font-size:90%;	
}



@media(min-width:768px){
	header .container{
		display:flex;
		align-items:center;
		justify-content:space-between;
		max-width:1000px;
		max-width:var(--large-width);
		margin-left:auto;
		margin-right:auto;	
	}
	
	.headB{
		display:block !important;	
		
	}
	
	
	
	.headB ul{
		display:flex;
	}
	/*ヘッダーC：トグルボタンの非表示*/
	.headC{
		display:none;	
		
	}
	
	.conA h1{
		font-size:115px;	
	}
	
	.conA p{
		font-size:24px;	
	}
		
	.conB .container{
	display:flex;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;	
		
	}
	
	.conB .text{
	flex:1;	
	}
	
	.conC .container{
	display:flex;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;
			
	}
	
	.conC .photo{
	flex:3;	
	}
	
	.conC .text{
	flex:2;	
	padding:50px;
	}
	
	.conC-2 .container{
	display:flex;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;
			
	}
	
	.conC-2 .photo{
	flex:3;	
	}
	
	.conC-2 .text{
	flex:2;	
	padding:50px;
	}
		
	
	.conD .container{
	display:flex;
	flex-direction:row-reverse;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;
	padding-top:40px;
	padding-bottom:40px;
			
	}
	
	.conD .photo{
	flex:0 0 400px;	
	}
	
	.conD .text{
	flex:1;	
	padding:50px;
	}
	
		.conD-2 .container{
	display:flex;
	flex-direction:row-reverse;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;
	padding-top:40px;
	padding-bottom:40px;
			
	}
	
	.conD-2 .photo{
	flex:0 0 400px;	
	}
	
	.conD-2 .text{
	flex:1;	
	padding:50px;
	}
	
	
	
	.conE .container{
	display:flex;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;
	padding-top:40px;
	padding-bottom:40px;
			
	}
	
	.conE .photo{
	flex:0 0 400px;	
	}
	
	.conE .text{
	flex:1;	
	padding:50px;
	}
	
	.conF .container{
	display:flex;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;
	padding-top:40px;
	padding-bottom:40px;
			
	}
	
	.conF .photo{
	flex:0 0 400px;	
	}
	
	.conF .text{
	flex:1;	
	padding:50px;
	}
	
		.conF-2 .container{
	display:flex;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;
	padding-top:40px;
	padding-bottom:40px;
			
	}
	
	.conF-2 .photo{
	flex:0 0 400px;	
	}
	
	.conF-2 .text{
	flex:1;	
	padding:50px;
	}
	
	
	footer .container{
	display:flex;
	flex-wrap:wrap;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;	
		
	}
	
	.footA{
	flex:0 0 40%;	
	}
	
	.footB{
	display:flex;
	flex:0 0 60%;	
		
	}
	
	.footB div{
	flex:1;	
	}
	
	.footB div:not(:first-child){
	margin-left:40px;	
	}
	
	.footC{
	flex: 0 0 100%;	
		
	}
	
	.history-container{
	display:flex;
	max-width:1000px;
	max-width:var(--large-width);
	margin-left:auto;
	margin-right:auto;
			
	}
	
	.history .photo{
	flex:3;	
	}
	
	.history .text{
	flex:2;	
	padding:50px;
	}
	
	/*コンタクトページ*/
	.contact-wrap{
		display:flex;	
	}
	
	.contact{
	flex:1;		
	}
	
	.contact{
	margin-right:20px;
		
	}
	
}

@media(min-width:1000px){
	.listC article{
	flex:1 1 25%;	
	}
	
}




/* ITキャリアバナー */

.BanBox {
	padding: 0 20px;
}

.BanBox a {
	display: block;
    font-size: 0;
    max-width: 768px;
    margin: 30px auto 0;
}

.BanBox a img {
	width: 100%;
}

/*==============================
 ly-About
==============================*/

.ly-About .br1023,
.ly-About .br767 {
	display: none;
}

.ly-About .inner {
	display: flex;
	max-width: 1000px;
	flex-wrap: wrap;
	padding: 40px 0;
	margin: 0 auto;
}

.ly-About .bg-Image {
	width: 400px;
	background-size: cover;
	background-position: center center;
	background-color: #666666;
	margin: 0;
}

.ly-About .txt-Box {
	width: calc(100% - 400px);
	padding: 50px;
	margin: 0;
	box-sizing: border-box;
}

@media screen and (max-width: 1023px) {

	.ly-About .br1023 {
		display: block;
	}
	
	.ly-About .bg-Image {
		width: 300px;
	}

	.ly-About .txt-Box {
		width: calc(100% - 300px);
		padding: 50px 40px;
	}

}

@media screen and (max-width: 767px) {

	.ly-About .br767 {
		display: block;
	}

	.ly-About .inner {
		display: flex;
		max-width: 1000px;
		flex-wrap: wrap;
		padding: 0 0 20px;
		margin: 0 auto;
	}

	.ly-About .bg-Image {
		width: 100%;
	}

	.ly-About .bg-Image::before {
		content: "";
		display: block;
		padding-top: 50%;
	}

	.ly-About .txt-Box {
		width: 100%;
		padding: 40px 20px;
	}

}


/*==============================
 tp-About
==============================*/

.tp-About {
	background-color: #cd5f60;
}

.tp-About .bg-Image {
	background-image: url(img/tp_about_bg.jpg);
}

.tp-About .ttl {
	color: #ffffff;
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 30px;
}

.tp-About .ttl span {
	display: inline-block;
	color: #cd7071;
	font-size: 26px;
	background-color: #ffffff;
	padding: 5px 10px;
	margin-right: 5px;
}

.tp-About dl dt {
	color: #ffffff;
	font-size: 20px;
	border-bottom: 1px solid #ffffff;
	margin-bottom: 20px;
}

.tp-About dl dd {
	color: #ffffff;
	line-height: 1.8;
	margin: 0;
}

.tp-About dl dd b {
	font-size: 16px;
}

@media screen and (max-width: 1023px) {

	.tp-About .ttl {
		font-size: 17px;
		margin-bottom: 20px;
	}

	.tp-About .ttl span {
		font-size: 23px;
		letter-spacing: -0.4px;
		margin-bottom: 5px;
	}

	.tp-About dl dt {
		font-size: 18px;
	}

}

@media screen and (max-width: 767px) {
	
    .tp-About .ttl span {
        font-size: 26px;
        line-height: 1.4;
        letter-spacing: normal;
        padding: 5px 15px;
        margin-right: 10px;
        margin-bottom: 0;
    }

	.tp-About dl dt {
        font-size: 18px;
        letter-spacing: -0.4px;
    }

}


/*==============================
 tp-BizAbout
==============================*/

.tp-BizAbout {
	background-color: #2c51a1;
}

.tp-BizAbout .inner {
	flex-direction: row-reverse;
}

.tp-BizAbout .bg-Image {
	background-image: url(img/tp_bizabout_bg.jpg);
}

.tp-BizAbout .catch-Txt {
	color: #ffffff;
	font-size: 17px;
	font-weight: bold;
	margin-bottom: 20px;
}

.tp-BizAbout .ttl {
	margin-bottom: 20px;
}

.tp-BizAbout .ttl span {
	color: #315e81;
	font-size: 26px;
	background-color: #ffffff;
	padding: 5px 10px;
}

.tp-BizAbout .txt {
	color: #ffffff;
	line-height: 1.8;
	letter-spacing: -0.2px;
	margin-bottom: 30px;
}

.tp-BizAbout .txt b {
	font-size: 16px;
}

.tp-BizAbout .btn a {
	display: block;
	max-width: 420px;
	color: #ffffff;
	font-size: 14px;
	text-decoration: none;
	background-color: #0c3befd4;
	border: 4px solid #ffffff;
	padding: 10px 30px;
	border-radius: 6px;
	box-sizing: border-box;
	position: relative;
}

.tp-BizAbout .btn a:hover {
	background-color: #515dbb;
}

.tp-BizAbout .btn a::after {
	content: "";
	display: block;
	width: 4px;
	height: 4px;
	border-top: 3px solid #ffffff;
	border-right: 3px solid #ffffff;
	position: absolute;
	top: 0;
	right: 15px;
	bottom: 0;
	margin: auto;
	transform: rotate(45deg);
	z-index: 1;
}

@media screen and (max-width: 1023px) {

	.tp-BizAbout .catch-Txt {
		font-size: 16px;
	}

	.tp-BizAbout .ttl span {
		font-size: 23px;
	}

	.tp-BizAbout .btn a {
		padding: 10px 20px 10px 20px;
	}

	.tp-BizAbout .btn a::after {
		width: 3px;
		height: 3px;
		border-top: 2px solid #ffffff;
		border-right: 2px solid #ffffff;
	}

}

@media screen and (max-width: 767px) {

	.tp-BizAbout .catch-Txt {
        font-size: 15px;
    }

	.tp-BizAbout .ttl {
		margin-bottom: 30px;
	}
	
	.tp-BizAbout .ttl span {
        font-size: 20px;
    }

}


/*==============================
 biz-Banner
==============================*/

.biz-Banner {
	max-width: 420px;
    width: 100%;
    position: absolute;
    top: 94px;
    left: 55px;
    z-index: 1;
}

.biz-Banner .inner {
	background-color: #095b9b;
    border: 5px solid #1c90ef;
    transition: .6s all;
}

.biz-Banner a:hover .inner {
	background-color: #258fe1;
	border: 5px solid #142635;
}

.biz-Banner .box {
	/*padding-right: 30px;*/
	position: relative;
}

.biz-Banner .box::before {
	content: "";
    width: 6px;
    height: 6px;
    border-top: 3px solid #ffffff;
    border-right: 3px solid #ffffff;
    position: absolute;
    top: 0;
    right: 12px;
    bottom: 0;
    margin: auto;
    transform: rotate(45deg);
    z-index: 1;
}

.biz-Banner .ttl {
	color: #ffffff;
	font-size: 24px;
	/*background-image: url(img/bb_bg.jpg);*/
	background-size: cover;
	background-position: center center;
	padding: 30px 0;
	margin: 0;
}

.biz-Banner .ttl span {
	display: block;
	font-size: 14px;
}

@media screen and (max-width: 1699px) {

	.biz-Banner {
		top: 20px;
		left: 20px;
	}

}

@media screen and (max-width: 1279px) {

	.biz-Banner {
		max-width: 380px;
	}

	.biz-Banner .ttl {
		font-size: 20px;
		padding: 20px 0;
	}

}

@media screen and (max-width: 1023px) {

	.biz-Banner {
        max-width: 350px;
        left: 0;
    }

	.biz-Banner .ttl {
		padding: 20px 0;
	}

}

@media screen and (max-width: 767px) {

	.biz-Banner {
		max-width: 330px;
		top: auto;
		right: 0;
		bottom: 30px;
		left: auto;
	}

	.biz-Banner a {
		display: block;
        margin-top: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background-color: transparent;
        width: auto;
        color: transparent;
	}

	.biz-Banner .box {
		padding-right: 0;
		padding-left: 20px;
	}

	.biz-Banner .box::before {
		border-top: 0;
        border-right: 0;
        border-bottom: 2px solid #ffffff;
        border-left: 2px solid #ffffff;
        right: auto;
        left: 7px;
        bottom: 0;
	}

	.biz-Banner .ttl {
		font-size: 17px;
	}

	.biz-Banner .ttl span {
		font-size: 12px;
	}

}


/*==============================
 st-Site
==============================*/

.st-Site {
	margin-top: 120px;
}

.st-Site .br767 {
	display: none;
}

.st-Site .inner {
    display: flex;
    align-items: stretch;
}

.st-Site .item {
    display: flex;
    width: 50%;
    align-items: stretch;
}

.st-Site .item a {
    display: flex;
    width: 100%;
    height: 100%;
	color: #333333;
	text-decoration: none;
    position: relative;
}

.st-Site .item .outer {
    display: flex;
    background-size: cover;
    background-position: center center;
    padding: 80px 0;
}

.st-Site .item .box {
    width: calc(100% - 80px);
    background-color: rgba(255, 255, 255, 0.7);
    padding: 60px 40px;
    margin: 0 auto;
    box-sizing: border-box;
}

.st-Site .item .txt {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
}

.st-Site .item .ttl {
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    line-height: 1;
	margin-top: 0;
    margin-bottom: 30px;
}

.st-Site .item .ttl .en {
	font-family: "Fugaz One", sans-serif;
}

.st-Site .item .ttl span {
    display: block;
    font-size: 52px;
}

.st-Site .item .txt-Box p {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.8;
	letter-spacing: -0.5px;
	margin: 0;
}

.st-Site .item .btn {
    margin-top: 30px;
}

.st-Site .item .btn p {
    color: #ffffff;
    max-width: 320px;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border-radius: 5px;
    padding: 15px 0;
    margin: 0 auto;
    transition: .6s all;
}


/*===== actworld-Basic =====*/

.actworld-Basic .outer {
    background-image: url(img/basic_image.jpg);
}

.actworld-Basic .box {
    border: 6px solid #cd7071;
}

.actworld-Basic .txt b {
    color: #fa1111;
}

.actworld-Basic .ttl {
    color: #910063;
}

.actworld-Basic .txt-Box b {
    color: #fa1111;
}

.actworld-Basic .btn p {
    background-color: #cd7071;
    border: 1px solid #cd7071;
}

/*===== actworld-Biz =====*/

.actworld-Biz a::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(51, 51, 51, 0.5);
    position: absolute;
    top: 0;
    right: 0;
    transition: .6s all;
}

.actworld-Biz a:hover::before {
    background-color: transparent;
}

.actworld-Biz .outer {
    background-image: url(img/business_image.jpg);
}

.actworld-Biz .box {
    border: 6px solid #185aea;
}

.actworld-Biz .txt .b1 {
    color: #091ff8;
}

.actworld-Biz .txt .b2 {
    color: #4d09fa;
}

.actworld-Biz .ttl {
    color: #185aea;
}

.actworld-Biz .b1 {
    color: #091ff8;
}

.actworld-Biz .b2 {
    color: #4d09fa;
}

.actworld-Biz .btn p {
    background-color: #185aea;
    border: 1px solid #185aea;
}



@media screen and (max-width:1023px) {

	.st-Site {
		margin-top: 100px;
	}

    .st-Site .item {
        width: 100%;
    }

    /*===== actworld-Basic =====*/

    .st-Site .item.actworld-Basic {
        display: none;
    }

	/*===== actworld-Biz =====*/

    .st-Site .actworld-Biz a::before {
        content: none;
    }

}

@media screen and (max-width:767px) {

	.st-Site {
		margin-top: 80px;
	}

	.st-Site .br767 {
		display: block;
	}

    .st-Site .item .outer {
        padding: 50px 0;
    }

    .st-Site .item .box {
        width: calc(100% - 40px);
        padding: 40px 20px;
    }

    .st-Site .item .ttl {
        font-size: 28px;
        line-height: 1.2;
    }

    .st-Site .item .ttl span {
        font-size: 48px;
    }

    .st-Site .item .btn {
        margin-top: 20px;
    }

    /*===== actworld-Biz =====*/

    .actworld-Biz .outer {
        background-image: url(img/business_image_sp.jpg);
    }

    .actworld-Biz.box {
        border: 4px solid #315e81;
    }

}


/*==============================
itcareer-Userflow
==============================*/

.itcareer-Userflow {
    margin: 100px 0;
}

.itcareer-Userflow .sp-Br {
    display: none;
}

.itcareer-Userflow .outer {
    max-width: 1040px;
    padding: 0 20px;
    margin: 0 auto;
    box-sizing: border-box;
}

.itcareer-Userflow .inner {
    background-image: url(img/itcareer_bg.jpg);
    background-size: cover;
    background-position: right;
    padding: 40px 30px;
    position: relative;
}

.itcareer-Userflow .inner::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    /*background-image: linear-gradient(90deg, rgba(233, 226, 122, 1) 40%, rgba(49, 91, 149, 0) 100%);*/
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.itcareer-Userflow .col {
    max-width: 820px;
    position: relative;
    z-index: 2;
}

.itcareer-Userflow .catch-Txt {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 20px;
}

.itcareer-Userflow .ttl {
    margin-bottom: 30px;
}

.itcareer-Userflow .ttl span {
    color: #ffffff;
    font-size: 32px;
    background-color: #7d7504;
    padding: 5px 20px;
}

.itcareer-Userflow .txt-Box {
    background-color: rgba(255, 255, 255, 0.8);
    padding: 20px;
    margin-bottom: 30px;
    box-sizing: border-box;
}

.itcareer-Userflow .txt-Box p {
    font-size: 16px;
    line-height: 1.8;
}

.itcareer-Userflow .btn a {
    display: block;
    max-width: 380px;
    color: #ffffff;
    font-size: 17px;
    font-weight: bold;
    text-align: center;
    background-color: #6f7708;
    border: 1px solid #8f9f15;
    text-decoration: none;
    border-radius: 10px;
    padding: 15px 20px;
    transition: .6s all;
}

.itcareer-Userflow .btn a:hover {
    color: #efeaa4;
    background-color: #89865c;
}

@media screen and (max-width: 1023px) {

    .itcareer-Userflow {
        margin: 80px 0;
    }
    
    .itcareer-Userflow .ttl span {
        font-size: 28px;
    }

    .itcareer-Userflow .btn a {
        font-size: 16px;
    }

}

@media screen and (max-width: 767px) {

    .itcareer-Userflow .sp-Br {
        display: block;
    }

    .itcareer-Userflow .inner {
        background-image: url(img/itcareer_bg_sp.jpg);
        background-position: bottom;
        padding: 40px 20px;
    }

    /* .itcareer-Userflow .inner::before {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        background-image: linear-gradient(135deg, rgba(138,212,255,1) 20%, rgba(49,91,149,0) 100%);
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
    } */

    .itcareer-Userflow .catch-Txt {
        font-size: 15px;
        margin-bottom: 10px;
    }

    .itcareer-Userflow .ttl span {
        font-size: 26px;
        background-color: transparent;
        padding: 0;
    }

    .itcareer-Userflow .ttl span b {
        display: inline-block;
        background-color: #7d7504;
        padding: 5px 10px;
    }

    .itcareer-Userflow .ttl span b:last-of-type {
        margin-top: 5px;
    }

}


/*==============================
 biz-About
==============================*/

.biz-About {
	padding: 30px 20px 0;
	margin-bottom: 140px;
}

.biz-About .br1023,
.biz-About .br767 {
	display: none;
}

.biz-About .image {
	font-size: 0;
}

.biz-About .image img {
	width: 100%;
	height: auto;
}

.biz-About .ttl {
	color: #ffffff;
	font-size: 160%;
	text-align: center;
	background-image: linear-gradient(90deg, #4678bd 0%, #315b95 100%);
    border-left: 15px solid #205075;
	padding: 10px 0;
	margin-bottom: 40px;
}

@media screen and (max-width: 1023px) {

	.biz-About {
		margin-bottom: 120px;
	}
	
	.biz-About .br1023 {
		display: block;
	}

}

@media screen and (max-width: 767px) {

	.biz-About {
		margin-bottom: 100px;
	}

	.biz-About .br767 {
		display: block;
	}

}


/*===== .biz-Mainimage =====*/

.biz-About .biz-Mainimage {
	margin: 0 0 60px;
	position: relative;
}

.biz-About .biz-Mainimage img {
	height: 420px;
	object-fit: cover;
	object-position: center;
}

.biz-About .biz-Mainimage figcaption {
	color: #315e81;
	font-size: 30px;
	font-weight: bold;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
}

.biz-About .biz-Mainimage figcaption span {
	display: block;
	font-size: 80px;
	font-family: 'Fugaz One', cursive;
}

@media screen and (max-width: 1023px) {

	.biz-About .biz-Mainimage {
		margin-bottom: 50px;
	}

	.biz-About .biz-Mainimage img {
		height: 350px;
	}

	.biz-About .biz-Mainimage figcaption {
		font-size: 28px;
	}
	
	.biz-About .biz-Mainimage figcaption span {
		font-size: 70px;
	}
}

@media screen and (max-width: 767px) {

	.biz-About .biz-Mainimage img {
        height: 220px;
    }

	.biz-About .biz-Mainimage figcaption {
		font-size: 24px;
	}
	
	.biz-About .biz-Mainimage figcaption span {
		font-size: 48px;
	}
}


/*===== .ly-Col =====*/

.biz-About .ly-Col h2 {
	color: #333333;
	font-size: 180%;
	padding-left: 20px;
	margin-bottom: 40px;
	border-bottom: 1px solid #333333;
	position: relative;
}

.biz-About .ly-Col h2::before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-left: 10px solid #315e81;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
	position: absolute;
	top: 10px;
	left: 0;
	z-index: 1;
}

@media screen and (max-width: 1023px) {

	.biz-About .ly-Col h2 {
		font-size: 170%;
	}

}

@media screen and (max-width: 767px) {

	.biz-About .ly-Col h2 {
        font-size: 160%;
		margin-bottom: 30px;
    }

}


/*===== .what-Col =====*/

.biz-About .what-Col {
	margin-bottom: 120px;
}

.biz-About .what-Col dl {
	padding: 0 20px;
}

.biz-About .what-Col dl dt {
	color: #333333;
	font-size: 140%;
	line-height: 1.8;
	margin-bottom: 30px;
}

.biz-About .what-Col dl dt .b1 {
	color: #091ff8;
}

.biz-About .what-Col dl dt .b2 {
	color: #4d09fa;
}

.biz-About .what-Col dl dd {
	color: #333333;
	font-size: 110%;
	line-height: 2;
	margin-bottom: 0;
	margin-left: 0;
}

.biz-About .what-Col dl dd + dd {
	margin-top: 20px;
}

@media screen and (max-width: 1023px) {
	
	.biz-About .what-Col {
		margin-bottom: 100px;
	}

	.biz-About .what-Col dl dt {
		font-size: 130%;
		letter-spacing: 0.5px;
	}

}

@media screen and (max-width: 767px) {

	.biz-About .what-Col {
		margin-bottom: 80px;
	}

	.biz-About .what-Col dl {
		padding: 0 5px;
	}

	.biz-About .what-Col dl dt {
        font-size: 120%;
		margin-bottom: 20px;
    }

}

/*===== .difference-Col =====*/

.biz-About .difference-Col {
	margin-bottom: 120px;
}

.biz-About .difference-Col h2 {
	margin-bottom: 80px;
}

.biz-About .difference-Col .course-Box {
	padding: 0 20px;
	margin-bottom: 60px;
}

.biz-About .difference-Col .course-Box .item {
	padding: 50px 30px 30px;
	border-radius: 10px;
	position: relative;
}

.biz-About .difference-Col .course-Box .basic-Item {
	border: 2px solid #ec6b6f;
}

.biz-About .difference-Col .course-Box .biz-Item {
	border: 2px solid #315e81;
}

.biz-About .difference-Col .course-Box .item + .item {
	margin-top: 80px;
}

.biz-About .difference-Col .course-Box .item h3 {
	color: #ffffff;
	font-size: 160%;
	padding: 5px 15px;
	margin: 0;
	position: absolute;
	top: -21px;
	left: 30px;
}

.biz-About .difference-Col .course-Box .basic-Item h3 {
	background-color: #ec6b6f;
}

.biz-About .difference-Col .course-Box .biz-Item h3 {
	background-color: #315e81;
}

.biz-About .difference-Col .course-Box .item p {
	font-size: 120%;
	font-weight: bold;
	margin: 0;
}

.biz-About .difference-Col .course-Box .item p b {
	font-size: 140%;
}

.biz-About .difference-Col .course-Box .basic-Item p b {
	color: #e53f44;
}

.biz-About .difference-Col .course-Box .biz-Item p b {
	color: #124267;
}

.biz-About .difference-Col .txt-Box {
	padding: 0 20px;
}

.biz-About .difference-Col .txt-Box p {
	color: #333333;
	font-size: 110%;
	line-height: 2;
}

.biz-About .difference-Col .txt-Box p + p {
	padding-top: 20px;
}

.biz-About .difference-Col .txt-Box .b1 {
	color: #ffffff;
	background-color: #ec6b6f;
	padding: 5px;
	margin-right: 5px;
}

.biz-About .difference-Col .txt-Box .b2 {
	color: #ffffff;
	background-color: #315e81;
	padding: 5px;
	margin-right: 5px;
}

h3 a{
	text-decoration:none;
	color:#ffffff;	
}

.b2 a{
	text-decoration:none;
	color:#ffffff;	
}



@media screen and (max-width: 1023px) {

	.biz-About .difference-Col {
		margin-bottom: 100px;
	}

	.biz-About .difference-Col h2 {
		margin-bottom: 70px;
	}

	.biz-About .difference-Col .course-Box {
		margin-bottom: 50px;
	}

	.biz-About .difference-Col .course-Box .item + .item {
		margin-top: 60px;
	}
	
	.biz-About .difference-Col .course-Box .item h3 {
		font-size: 150%;
	}

	.biz-About .difference-Col .course-Box .item p b {
		font-size: 130%;
	}
	
}

@media screen and (max-width: 767px) {

	.biz-About .difference-Col {
        margin-bottom: 60px;
    }

	.biz-About .difference-Col .course-Box {
		padding: 0;
		margin-bottom: 40px;
	}

	.biz-About .difference-Col .course-Box .item {
		padding: 40px 20px 30px;
	}

	.biz-About .difference-Col .course-Box .item h3 {
        font-size: 140%;
        top: -19px;
        left: 20px;
    }

	.biz-About .difference-Col .course-Box .item p b {
        font-size: 120%;
    }

	.biz-About .difference-Col .txt-Box {
		padding: 0 5px;
	}

}


/*===== .link-Col =====*/

.biz-About .link-Col .outer {
	background-image: url(img/business/biz_mainimage.jpg);
	background-size: cover;
	background-position: center center;
	padding: 30px 0;
}

.biz-About .link-Col .inner {
	width: calc(100% - 60px);
	background-color: rgba(255, 255, 255, 0.8);
	border: 3px solid #315e81;
	padding: 40px 30px;
	margin: 0 auto;
	box-sizing: border-box;
}

.biz-About .link-Col .txt {
	font-size: 100%;
	font-weight: bold;
	text-align: center;
	margin-bottom: 20px;
}

.biz-About .link-Col .txt .b1 {
	color: #091ff8;
}

.biz-About .link-Col .txt .b2 {
	color: #4d09fa;
}

.biz-About .link-Col h2 {
	color: #315e81;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	line-height: 1.2;
	margin-bottom: 30px;
}

.biz-About .link-Col h2 span {
	display: block;
	font-size: 60px;
	font-family: 'Fugaz One', cursive;
}

.biz-About .link-Col .btn a {
	display: block;
	max-width: 300px;
	color: #ffffff;
	font-size: 110%;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	background-color: #315e81;
	border: 1px solid #315e81;
	border-radius: 10px;
	padding: 20px 0;
	margin: 0 auto;
	position: relative;
	transition: .6s all;
}

.biz-About .link-Col .btn a:hover {
	color: #315e81;
	background-color: #ffffff;
}

.biz-About .link-Col .btn a::before {
	content: "";
    display: block;
    width: 19px;
    height: 14px;
    background-image: url(img/business/blank_icon.png);
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 24px;
    right: 20px;
    z-index: 1;
}

.biz-About .link-Col .btn a::after {
	content: "";
    display: block;
    width: 19px;
    height: 14px;
    background-image: url(img/business/blank_icon_c.png);
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 24px;
    right: 20px;
	opacity: 0;
    z-index: 2;
	transition: .6s all;
}

.biz-About .link-Col .btn a:hover::after {
	opacity: 1;
}

@media screen and (max-width: 1023px) {

	.biz-About .link-Col h2 {
		font-size: 22px;
	}

	.biz-About .link-Col h2 span {
		font-size: 50px;
	}

}

@media screen and (max-width: 1023px) {

	.biz-About .link-Col .outer {
		background-image: url(img/business/link_image_sp.jpg);
		padding: 20px 0;
	}

	.biz-About .link-Col .inner {
		width: calc(100% - 40px);
		padding: 30px 20px;
	}

	.biz-About .link-Col .txt {
		font-size: 95%;
	}

	.biz-About .link-Col h2 {
        font-size: 20px;
		margin-bottom: 20px;
    }

	.biz-About .link-Col h2 span {
        font-size: 38px;
    }

	.biz-About .link-Col .btn a {
		font-size: 100%;
		padding: 15px 0;
	}

	.biz-About .link-Col .btn a::before {
		width: 17px;
		height: 13px;
		top: 20px;
		right: 15px;
	}

	.biz-About .link-Col .btn a::after {
		width: 17px;
		height: 13px;
		top: 20px;
		right: 15px;
	}

}