@charset "UTF-8";

/* CSS Document */
/*--------------------------*/
/*仕事を知る　トップ*/
/*--------------------------*/

/*メインビジュアル*/
div.mainImageWorks{
	background-size: cover;
	background-position: center center;
	background-image: url(../img/works_main_image.jpg);
	position: relative;
	color:#FFFFFF;
}

div.mainImageWorks h1{
	font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-weight: bold;
	text-align: center;
	text-shadow:0px -1px 5px rgba(0,0,0,0.6), 0px 1px 5px rgba(0,0,0,0.6),1px 0px 5px rgba(0,0,0,0.6),-1px 0px 5px rgba(0,0,0,0.6);
	-moz-text-shadow: 0px -1px 5px rgba(0,0,0,0.6), 0px 1px 5px rgba(0,0,0,0.6),1px 0px 5px rgba(0,0,0,0.6),-1px 0px 5px rgba(0,0,0,0.6);
    -o-text-shadow: 0px -1px 5px rgba(0,0,0,0.6), 0px 1px 5px rgba(0,0,0,0.6),1px 0px 5px rgba(0,0,0,0.6),-1px 0px 5px rgba(0,0,0,0.6);
    -ms-text-shadow: 0px -1px 5px rgba(0,0,0,0.6), 0px 1px 5px rgba(0,0,0,0.6),1px 0px 5px rgba(0,0,0,0.6),-1px 0px 5px rgba(0,0,0,0.6);
}

div.mainImageWorks p{
	font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	font-weight: bold;
	text-align: center;
	text-shadow:0px -1px 5px rgba(0,0,0,0.6), 0px 1px 5px rgba(0,0,0,0.6),1px 0px 5px rgba(0,0,0,0.6),-1px 0px 5px rgba(0,0,0,0.6);
	-moz-text-shadow: 0px -1px 5px rgba(0,0,0,0.6), 0px 1px 5px rgba(0,0,0,0.6),1px 0px 5px rgba(0,0,0,0.6),-1px 0px 5px rgba(0,0,0,0.6);
    -o-text-shadow: 0px -1px 5px rgba(0,0,0,0.6), 0px 1px 5px rgba(0,0,0,0.6),1px 0px 5px rgba(0,0,0,0.6),-1px 0px 5px rgba(0,0,0,0.6);
    -ms-text-shadow: 0px -1px 5px rgba(0,0,0,0.6), 0px 1px 5px rgba(0,0,0,0.6),1px 0px 5px rgba(0,0,0,0.6),-1px 0px 5px rgba(0,0,0,0.6);
}

/*スマホ*/
@media screen and (max-width:767px) {
div.mainImageWorks .inner{
	padding:15% 0;
}

div.mainImageWorks h1{
	font-size: 25px;
}

div.mainImageWorks p{
	font-size: 15px;
}
}

/*タブレット*/
@media screen and (min-width: 768px) and (max-width: 979px) { 
div.mainImageWorks .inner{
	padding:9% 0;
}

div.mainImageWorks h1{
	font-size: 50px;
}

div.mainImageWorks p{
	font-size: 25px;
}
}

/*PC*/
@media screen and (min-width:980px) {
div.mainImageWorks .inner{
	padding:100px 0;
}

div.mainImageWorks h1{
	font-size: 70px;
}

div.mainImageWorks p{
	font-size: 30px;
}
}


/*コンテンツ*/
div#worksArea{
	max-width:1000px;
	margin:0 auto;
}

.worksTextBox{
	font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, 'Noto Sans JP', "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
	font-weight:bold;
	line-height:200%;
}

.departmentIntroBox{
	background-size: cover;
	background-position: center center;
	background-image: url(../img/works_department_intro_bg.jpg);
}

.departmentIntroBox p{
	margin:0;
}

.departmentIntroBox h2{
	font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	text-align:center;
	font-weight:bold;
}
/*スマホ*/
@media screen and (max-width:767px) {
div#worksArea{
	padding-top:20px;
}

.worksTextBox{
	padding:0 15px;
	margin-bottom:30px;
}

.departmentIntroBox{
	padding:30px 0;
}

.departmentIntroBox h2{
	font-size:25px;
	margin-bottom:15px;
}
}
/*タブレット*/
@media screen and (min-width: 768px) and (max-width: 979px) { 
div#worksArea{
	padding-top:30px;
}

.worksTextBox{
	padding:0 20px;
	margin-bottom:60px;
}

.departmentIntroBox{
	padding:50px 0;
}

.departmentIntroBox h2{
	font-size:40px;
	margin-bottom:20px;
}
}
/*PC*/
@media screen and (min-width:980px) {
div#worksArea{
	padding-top:30px;
}

.worksTextBox{
	padding:0 50px;
	margin-bottom:60px;
}

.departmentIntroBox{
	padding:60px 0;
}

.departmentIntroBox h2{
	font-size:40px;
	margin-bottom:20px;
}
}

/*調整用*/
.red{
	color:#ec1c24;
}

.orange{
	color:#f6921e;
}

.blue{
	color:#3fc3d0;
}

.green{
	color:#8bc53f;
}

.brown{
	color:#603813;
}