@charset "utf-8";
.h1_1{
	color: #ff0000;
	margin-top: 320px;
	margin-bottom: 0;
}

.h1_2{
	color: #ff0000;
	margin-top: 180px;
	margin-bottom: -10px;
}

.yt {/*ユーチューブ動画設定*/
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.yt iframe {/*ユーチューブ動画設定*/
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

.video {/*ユーチューブ埋め込み*/
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  margin-bottom: 10px;
}

.video iframe {/*ユーチューブ埋め込み*/
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.design{
	color: #FFFFFF;
	margin-top: 7px;
}

.spring{
	font-size:48px;
	color:#ffffff;
}

.spring_2{
	font-size:28px;
	color:#ffffff;
}

.start{
	margin-top: -20px;
	font-size:48px;
	color:#ffffff;
}

.last{
	color:#333333;
	text-align: center;
	margin-top: 8px;
	margin-bottom: 20px;
	font-size: 14px;
}

.last_2{
	color:#333333;
	text-align: center;
	margin-top: 8px;
	margin-bottom: 0;
	font-size: 14px;
}

.yousei{
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 50px; 
	padding-bottom: 5px;
	width:500px;
}

.yousei_2{
	margin-top: 0;
	margin-bottom: 0; 
	padding-top: 30px;
	padding-bottom: 5px;
}

.rogo{
	text-align: center;
	margin-top: 20px; 
	margin-bottom: 0px;
}

.haru{
	margin-top: 40px;
	margin-bottom: 50px;
	width:530px;
}

.freelance_border{
	border:solid 1px #cccccc;
}

.qr{
	text-align: center; 
	width: 220px;
}


.corner{
	border-radius:.25rem;
}

.fs-nav{
	font-size: 0.67em;
}

.jumbotron_back {
    background: url("../img/2021foas_top.jpg") no-repeat;
    background-size: cover;
	background-position: 50% 0;
	max-width: 100%;
    height: 460px;
    color: #191919;
	border-radius: 0px;
}

.bg-nav{/*navの背景透明*/
	background-color:rgba(0,0,0,0.6);
}

body{
	background-image: url(../img/black.jpg);
	background-repeat: repeat-x;
	color:#555555;
}

.bg-ffffff{
	background-color: #FFFFFF;
}

.bg-0E0E0E{
	background-color:#0E0E0E;
}

.bg-000000{
	background-color:#000000;
}

.w-220{
	width: 220px;
}

[class*="col-6"] {
  padding-left: 3px;
  padding-right: 3px;
}

.circle-140{
	width: 140px; height: 140px;
}

.box_top{/*トップのメインの文字列の背景透明*/
	/*background-color: rgba(0,0,0,0.2);*/
	background-color: rgba(0,0,0,0);
	padding-top: 12px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
}

.box{/*メインの文字列の背景透明*/
	background-color: rgba(0,0,0,0.2);	
	padding: 10px;
}

#info{
	width: 98%;
	height: 200px;
	padding: 10px;
	overflow:scroll;
	border: solid 1px #EDEBEB;
	border-radius: 5px;
	margin-bottom: 40px;
	background-color: #fafafa;
}

/*スクロールバー*/
.scrollbox {
  poisition: relative;
  width: 90%;
  height: 240px;
  margin: 0 0 50px 10px;
  padding: 0 20px 0 0;
  background-color: transparent;
  box-shadow:0 2px 10px rgba(#000,.5);
  overflow-y: scroll;
}

.scrollbox::-webkit-scrollbar {/*スクロールバーの横幅の指定*/
    width:10px;
    background: #fff;
}

.scrollbox::-webkit-scrollbar-track{/*スクロールバーの背景の色と角丸指定*/
  border-left: solid 1px #ccc;
  border-right: solid 1px #ccc;
  box-shadow: 0 0 4px #ccc inset;
	background-color: transparent;
}

.scrollbox::-webkit-scrollbar-thumb {/*スクロールバー自体（つまみ部分）の色と角丸指定*/
  background-color:rgba(204,204,204,0.8);
  border-radius: 10px;
  box-shadow: none;
}

#greeting{
	border-radius: 5px;
	padding: 10px;
}
/*フッター背景色グラデーション緑色
.course{
	background-color: #2f5b2f;
	background-image: -webkit-linear-gradient(270deg,rgba(54,124,51,1.00) 0%,rgba(0,24,0,1.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(54,124,51,1.00) 0%,rgba(0,24,0,1.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(54,124,51,1.00) 0%,rgba(0,24,0,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(54,124,51,1.00) 0%,rgba(0,24,0,1.00) 100%);
}
*/

/*トップの画像下グラデーション黒色　画像Webおじさん室内写真
.black{
    background-image: -webkit-linear-gradient(270deg,rgba(13,9,10,1.00) 11.92%,rgba(79,79,79,1.00) 100%);
    background-image: -moz-linear-gradient(270deg,rgba(13,9,10,1.00) 11.92%,rgba(79,79,79,1.00) 100%);
    background-image: -o-linear-gradient(270deg,rgba(13,9,10,1.00) 11.92%,rgba(79,79,79,1.00) 100%);
    background-image: linear-gradient(180deg,rgba(13,9,10,1.00) 11.92%,rgba(79,79,79,1.00) 100%);
  }
*/
.course_black{
    background-image: -webkit-linear-gradient(270deg,rgba(83,83,83,1.00) 0%,rgba(19,19,19,1.00) 20.73%);
    background-image: -moz-linear-gradient(270deg,rgba(83,83,83,1.00) 0%,rgba(19,19,19,1.00) 20.73%);
    background-image: -o-linear-gradient(270deg,rgba(83,83,83,1.00) 0%,rgba(19,19,19,1.00) 20.73%);
    background-image: linear-gradient(180deg,rgba(83,83,83,1.00) 0%,rgba(19,19,19,1.00) 20.73%);
}

.list-unstyled.mt-8 .btn-link a {/*コース一覧文字色*/
	color:#999999;
}
	
.col-12 p a {/*サイトマップ/プライバシー／お問合せ文字色*/
	color:#999999;
}

.rounded-circle {/*ＳＮＳボタン*/
  border-radius: 50% !important;
}

#a a {/*背景白のリンク文字色 つづく*/
	color:#514F4F;
	font-weight: 600;
}

#info p a {/*背景白のリンク文字色 新着*/
	color:#514F4F;
	font-weight: 600;
		
}

 a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

.container.footer-container .top a {/*背景白のリンク文字色 topへ*/
	color:#514F4F;
	font-weight: 600;
		
}

.up-date{
	text-align:right; padding: 0px; margin: 0px;
	padding-right: 5px;
}

.text-r{
	text-align: right;
}
.video{
	background-color: #000000;
	color: #ffffff;
	border-radius: 5px;
}

.video-container{
	padding: 15px 15px 5px 15px;
}

.video-foas{
	margin-bottom: 0px;
	text-align: center;
}

.card_s{
	background-color: #f7f7f7;
	padding:10px;
}

.footer-container{
	font-size: 14px;
	line-height: 1.5
}

.footer-info{
	margin-bottom: 3px;
	color:#A2A0A0;
}

.footer-plan{
	margin-bottom: 3px;
	color:#A2A0A0; 
	border-bottom: dotted 1px #A2A0A0; 
	padding-bottom: 6px; 
	width: 230px;
}

.foas-logo{
	float: none;
}

.btn-g{
	background-color: #003300; 
	border-color:#858585;
}

.btn-gg{
	background-color:rgba(0,50,0,0.6); 
	border-color:#858585;
}

.btn-black{
	background-color:rgba(0,0,0,0.4); 
	border-color:#000000;
}



.btn-gray{
	background-color: #aaaaaa;
	border-color:#eeeeee;
}

.btn-red {/*キャンペーンボタンの色*/
	background-color: #cc0000;
	color: #ffffff;
}

.btn-gakkou {/*	学校長ボタンの色*/
	background-color: #333333;
	color: #ffffff;
}

.btn-red_2 {/*無料体験背景色赤*/
	background-color:rgba(204,0,0,0.7); 
	color: #ffffff;
}

.btn-red_3 {/*無料体験背景色緑透明*/
	background-color:rgba(47,91,47,0.9); 
	color: #ffffff;
}

.btn-red_4 {/*無料体験背景色緑べた*/
	background-color:rgba(47,91,47,1); 
	color: #ffffff;
}

.btn-ff6600{
	background-color: #ff6600;
	border-color:#eeeeee;
}

.btn-lg-s{
	padding:.3rem 1rem;
	font-size:1rem;
	line-height:1.5;
	border-radius:.3rem;
}

.m0-p0{
	margin: 0px;
	padding: 0px;
}

.mt-0{
	margin-top: 0px;
}

.mt-5{
	margin-top: 5px;
}

.mt-7{
	margin-top: 7px;
}

.mt-8{
	margin-top: 8px;
}

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

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

.mt-30{
	margin-top: 30px;
}

.mt-40{
	margin-top: 40px;
}

.mt-50{
	margin-top: 50px;
}

.mt-60{
	margin-top: 60px;
}

.mt-70{
	margin-top: 70px;
}

.mt-80{
	margin-top: 80px;
}

.mt-90{
	margin-top: 90px;
}

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

.mt{
	margin-top: 60px;
}

.mb-0{
	margin-bottom: 0px;
}

.mb-10{
	margin-bottom: 10px;
}

.mb-20{
	margin-bottom: 20px;
}

.mb-50{
	margin-bottom: 50px;
}

.mb-70{
	margin-bottom: 70px;
}

.mr-3{
	margin-right: 3px;
}

.mr-5{
	margin-right: 5px;
}

.p-0{
	padding: 0px;
}

.p-2{
	padding: 2px;
}

.pt-0{
	padding-top: 0;
}

.pl-0{
	padding-left: 0;
}

.pr-10{
	padding-right: 10px;
}

.pl-0_pt-0_mt-0{
	padding-left: 0;
	margin-top: 0;
	padding-top: 0;
}
.fs-14{
	font-size: 14px;
}

.fs-15{
	font-size: 15px;
}

.fs-16{
	font-size: 16px;
}

.fs-21{
	font-size: 21px;
}

.fs-30{
	font-size: 30px;
}

.fs-48{
	font-size: 48px;
}

.fs-50{
	font-size: 50px;
}

.fs-54{
	font-size: 54px;
}

.fs-88{
	font-size: 88px;
}

.fs-10em{
font-size: 1.0em;
}

.fs-15em{
font-size: 1.5em;
}

.fc-CFCBCB{
	color: #CFCBCB;
}

.fc-A2A0A{
	color:#A2A0A0;
}

.fc-663300{
	color:#663300;
}

.fc-ff0000{
	color: #ff0000;
}

.fc-999999{
	color: #999999;
}

.fc-ff6600{
	color: #ff6600;
}

.fc-005f8f{
	color:#005f8f;
}
.fc-333333{
	color:#333333;
}

.fc-ffffff{
	color:#ffffff;
}

.fc-ffe0e0{
	 color:#ffe0e0;
}

.fc-ffbdd6{
	 color:#ffbdd6;
}

.bg-003300{
	background-color: #003300;
}

.bg-001800{/*copyrightの背景色*/
	background-color: #001800;
}

.bg-0d090a{
	background-color: #0d090a;
}

.bg-transparent{
	background-color: transparent;
}

.container .row #point {
	display: none; /* スマホ縦横／タブレット縦は非表示 */
}

.fl-l{
	float: left;
}

.fl-r{
	float: right;
}

.top{/*トップへ*/
	text-align:right; 
	padding-right:20px;
}

.img{
	max-width:100%;
	height: auto;
}

.center{
	text-align: center;
}

.for_pc{
		display: none;
	}

.for_sp{
		display: block;
	}

.course-name {/*コース名文字装飾*/
	background-image: url(../img/icon_orange.gif);
	background-position: left center;
    background-repeat: no-repeat;
	padding-left: 20px;
	font-size: 1.02em;
	font-family: 'M PLUS Rounded 1c', sans-serif;/*グーグルフォント飾*/
}
.scrollbox p a {
}
body {
	color:#555555;
}

.movie-130{/*動画スタイル*/
	text-align:center;
	line-height:130%;
	margin-bottom: 16px;
}

.movie-wrap {/*ユーチューブ動画設定*/
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}

.movie-wrap iframe {/*ユーチューブ動画設定*/
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

.movie-wrap_2 {/*ユーチューブ動画設定*/
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}

.movie-wrap_2 iframe {/*ユーチューブ動画設定*/
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

.movie-130_3{/*動画スタイル*/
	text-align:center;
	line-height:130%;
	margin-bottom: 16px;
}

.movie-wrap_3 {/*ユーチューブ動画設定*/
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.movie-wrap_3 iframe {/*ユーチューブ動画設定*/
     position: absolute;
     top: 0;
     left: 0;
     width: 100%!important;
     height: 100%!important;
}

.web-design{
	font-size:40px;
	font-family:  'Righteous', cursive; 
	text-shadow: 1px 1px 0 #fff;
	line-height: 1.3;
}

.web-design_2{
	font-size:40px;
	font-family:  'Righteous', cursive; 
	text-shadow: 1px 1px 0 #000;
	line-height: 1.3;
}

.kansen{
	background-color:transparent;
	border:none;
}

.kansen_2{
	margin-top: 20px;
	margin-bottom: 50px;
	width:400px;
}

.kansen_2_2{
	border: solid 1px #ff0000; 
	padding: 10px; 
	background-color: #ffffff;
}

.kansen_3{
	margin-top: 20px; 
	margin-bottom: 50px; 
	width:100%;
}

.kansen_3_2{
	border: solid 1px #ff0000;
	padding: 10px;
	background-color: #ffffff;
}

.quality{
	text-align: center;
	margin-bottom: 0;
	font-size: 13px;
	color:#003300;
}

.otamesi{
	text-align: center;
	margin-bottom: 70px;
	margin-top: 30px;
}

.h-80{
	height: 80%;
}

@media screen and (min-width:576px) {
	
.jumbotron_back {
    background: url("../img/2021foas_top.jpg") no-repeat;
    background-size: cover;
	background-position: 50% 50%;
	max-width: 100%;
    height: 500px;
    color: #191919;
	border-radius: 0px;
}
	
.for_pc{
		display: none;
	}

.for_sp{
		display: block;
	}
}
@media screen and (min-width:768px) {
	
	
.for_pc{
		display: none;
	}

.for_sp{
		display: block;
	}
}
@media screen and (min-width:1080px) {
	
.jumbotron_back {
    background: url("../img/2021foas_top.jpg") no-repeat;
    background-size: cover;
	background-position: center center;
	max-width: 100%;
    height: 800px;
    color: #191919;
	border-radius: 0px;
}
	
.for_pc{
		display: none;
	}

.for_sp{
		display: block;
	}
}

@media screen and (min-width:1024px) {

.fs-nav{
	font-size: 15px;
}	
	
	
.container .row #point {
	display: block; /* タブレット横／パソコンは表示 */
}
	
.col-lg-4.col-sm-6.col-12.text-center a:hover img .rounded-circle {
		opacity: 0.7;
}
	
 a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

.foas-logo{
	float: left;
	margin-right: 5px;
}

.web-design{
	font-size:56px;
	font-family:  'Righteous', cursive; 
	text-shadow: 1px 1px 0 #fff;
	line-height: 1.3;
}

.web-design_2{
	font-size:56px;
	font-family:  'Righteous', cursive; 
	text-shadow: 1px 1px 0 #000;
	line-height: 1.3;
}
	
	.jumbotron_back {
    background: url(../img/2021foas_top.jpg) no-repeat;
    background-size: cover;
	background-position: center center;
	max-width: 100%;
    height: 750px;
    color: #191919;
	border-radius: 0px;
}
	
.mt{
	margin-top: 40px;
}

.box{/*メインの文字列の背景透明*/
	background-color: rgba(0,0,0,0.3);	
	padding: 10px;
}
	
.for_pc{
		display: block;
	}

.for_sp{
		display: none;
	}
	
	
#info{
	height: 436px;
}
	
}
@media screen and (min-width:1025px) {
	.for_pc{
		display: block;
	}

.for_sp{
		display: none;
	}
}