body {
font-family: -apple-system,BlinkMacSystemFont,Helvetica Neue,Hiragino Kaku Gothic ProN,Hiragino Sans,Roboto,Noto Sans JP,游ゴシック Medium,游ゴシック,Yu Gothic,Yu Gothic Medium,Meiryo,Arial,sans-serif;
}

.heading-text h1 {
font-size: 54px;
text-align: left;
margin: 0;
}

.heading-text {
margin-bottom: 0;
}

.heading-text.heading-section p {
color: #222;
text-align: left;
line-height: 180%;
font-weight: bold;
font-size: 22px;
}

.hero {
margin-bottom: -380px;
}

img.hero  {
width: 100%;
margin: 0 0 0 40px;
position: relative;
top:-380px;
}

img.cp  {
width: 100%;
}

.header-extras {
	height: 60px;
}

.header {
	height: 60px;
}

.header-extras > ul > li .btn {
font-size: 14px;
letter-spacing: 0;
}

#header.header-sticky .header-inner, #header.header-sticky #header-wrap {
padding: 8px 0;
}

#header .header-inner, #header #header-wrap {
height: 100px;
padding-top: 32px;
}

.mt-10 {
margin-top: 100px;
}




section.guide {
background-color: #146AF5;
color: #FFF;
}

section.guide h1 {
color: #FFF;
font-size: 40px;
}

section.guide .heading-text.heading-section p  {
color: #FFF;
font-size: 16px;
font-weight: normal;
}

section.guide p.cp {
color: #FFF;
font-weight:bold;
font-size: 16px;
margin: 8px 0 0 0;
}


.industry .col-lg-12 {
padding: 0;
}

.industry .heading-text.heading-section > h2,h3 {
font-weight: bold;
color: #222;
}

.industry .heading-text.heading-section > h2 {
font-size: 40px;
margin-bottom: 40px;
}

.industry .heading-text.heading-section > h2:before {
height: 0;
}

.recommend {
display: flex;
}

.recommend img{
width: 100%;
}

.recommend .col-lg-4 {
border-radius: 4px;
padding: 0;
margin: 0 1%;
max-width: 30%;
display: flex;
flex-direction: column;
}

.recommend .col-lg-4 a {
display: flex;
flex-direction: column;
flex-grow: 1;
}

.recommend .col-lg-4 h5{
padding: 16px 8px 24px 8px;
font-size: 16px;
font-weight: bold;
line-height: 150%;
background-color: #FFF;
flex-grow: 1;
display: flex;
}

.recommend .col-lg-4 a:hover {
opacity: 0.7;
}

#page-content {
background-color: #f0f0f0;
}

.FBanner {
text-align: left;
padding-top: 0;
}

.FBanner .col-lg-12 {
padding-top: 80px;
}

.col-lg-5 img,
.col-lg-7 img {
width: 100%;
}

.gakuwari-name {
font-size: 56px;
font-weight: bold;
color: #222;
margin: 0 0 0 16px ;
vertical-align: middle;
}

.gakuwari-text {
font-size: 24px;
margin: 0 0 0 24px;
color: #222;
font-weight: bold;
}

.gakuwari-btn {
padding: 24px;
font-size: 24px;
margin-bottom: 24px;
}



/* 991px */
@media (max-width: 991px) {

.heading-text h1 {
	width: 50%;
	font-size: 40px;
}

#header .header-inner #logo a > img, #header #header-wrap #logo a > img {
	height:60px ;
}

.heading-text.heading-section p {
	font-size: 16px;
	width: 45%;
}

.mt-10 {
	margin-top: 24px;
}

.header-extras {
display: none;
}

img.hero  {
width: 100%;
margin: 0 0 0 40px;
right: -15%;
top: -300px;
}

section.guide h1,
section.guide .heading-text.heading-section p {
	width: 100%;
}

}/* end:991px */


/* モバイルデバイス用のメディアクエリ */
@media (max-width: 767px) {

#header .container, #header .header-inner .container, #page-menu .container, .container {
	margin-bottom: 40px;
}

#header .header-inner, #header #header-wrap {
padding-top: 16px;
}

.heading-text h1 {
	width: 100%;
}

img.hero  {
width: 160%;
margin: 0 0 0 40px;
position: relative;
top:0;  
left: -30%;
}

.mt-10 {
margin-top: 20px;
}

.hero {
margin-bottom: 0;
}

#header .header-inner, #header #header-wrap {
margin: 16px;
}

#header .header-inner #logo a > img, #header #header-wrap #logo a > img {
height: 50px;
}

.heading-text h1 {
font-size: 32px;
text-align: center;
}

.heading-text.heading-section p {
font-size: 14px;
width: 100%;
margin-bottom: 16px;
}

img.hero {
margin: 0;
}

section.guide h1 {
	font-size: 24px;
	text-align: left;
}

section.guide .heading-text.heading-section p {
	font-size: 14px;
}

section.guide p.cp {
	margin-bottom: 50px;
}

.industry .heading-text.heading-section > h2 {
	font-size: 24px;
	margin-bottom: 24px;
}

.recommend .col-lg-4 {
	max-width: 100%;
	margin: 0 16px 16px 16px;
}


.gakuwari-text {
	display: block;
	margin:24px 0 ;
	font-size: 24px;
	line-height: 150%;
}

.FBanner .col-lg-12 {
	padding-left: 0;
}

.industry .col-lg-12 {
padding: 0 8px;
}

.heading-text.heading-section > h2 {
	line-height: 150%;
}

  .hero {
    order: -1;
  }
  
}