@charset "UTF-8"; .page-ttl{ background-image:url(../images/reform/h2.jpg);} @media screen and (min-width: 768px) { /* PC */ #message{width: 1100px;margin: 0 auto 80px ;background-image: url(../images/reform/bg01.png);background-repeat: no-repeat;background-position: top right;} #message h3{padding-top: 30px; margin-bottom: 60px;} #message .info{width: 510px;margin-bottom: 100px;} #message .info .text-space{font-size: 14px; margin-bottom: 30px;} #message .btn{width: 369px;margin: 0 auto;} #greeting{width: 1100px;margin: 0 auto 80px;position: relative;} #greeting .pic{position: absolute;top: 0;left: 0px;} #greeting .info{width: 720px;margin-bottom: 40px;margin-left: 380px;} #greeting .info h3{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 42px;font-weight: bold;color: #fca700;margin-bottom: 40px;} #greeting .info h4{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 22px;font-weight: bold;color: #000000;margin-bottom: 15px} #greeting .info .text{font-size: 14px;margin-bottom: 30px;} #greeting .stance{border: 5px solid #000000;padding: 40px 30px 30px;overflow: hidden;} #greeting .stance li{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 18px;font-weight: bold;color: #000000;position: relative;margin-left: 30px;width: 280px; float: left;margin-bottom: 20px;} #greeting .stance li:before{content: url(../images/reform/icon01.png);position: absolute;left: -30px;top: 0px;} #greeting .comment{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 38px;font-weight: bold;text-align: center; color: #ffffff; background-color: #2a4b14;padding: 25px 0;} #interview{width: 1100px;margin: 0 auto 80px;} #interview h3{width: 582px;margin: 0 auto 20px;} #interview .sub{font-size: 14px;line-height: 24px;margin-bottom: 30px;text-align: center;} #interview .staff{overflow: hidden;margin-bottom: 30px;} #interview .staff .info{border-left: 10px solid #000000;border-top: 10px solid #000000;border-bottom: 10px solid #000000;padding: 41px 70px 42px;width: 710px;background-color: #2a4b14;float: left;} #interview .staff .info h4{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 54px;font-weight: bold;color: #ffffff;margin-bottom: 20px;} #interview .staff .info h5{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 30px;color: #ffffff;margin-bottom: 20px;} #interview .staff .info .year{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;background-color: #ffffff;font-size: 24px;font-weight: bold; text-align: center;margin-bottom: 20px;} #interview .staff .info .text{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 30px;line-height: 40px;color: #fff;} #interview .btn{width: 369px;margin: 0 auto;} #flow{width: 1100px;margin: 0 auto 80px;border: 5px solid #000000;padding: 20px 30px ;} #flow h3{width: 460px;margin: 0 auto 20px;} #flow .bg{background-color: #f0f0f0;padding: 40px;overflow: hidden;} #flow .pic{width: 430px;float: left; } #flow .flow{width: 448px;float: right;} #recruit{width: 1100px;margin: 0 auto 200px;background-color: #0a0b24;padding: 30px;} #recruit h3{width: 338px;margin: 0 auto 30px;} #recruit .bg{background-color: #ffffff;padding: 40px;} #recruit .bg .job{overflow: hidden;margin-bottom: 40px;} #recruit .bg .job .info{width: 480px;float: left;} #recruit .bg .job .info h4{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 24px;font-weight: bold;text-align: center; color: #000000;margin-bottom: 20px;background-color: #f39900;padding: 10px 0;} #recruit .bg .job .info h5{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 24px;font-weight: bold; color: #000000;margin-bottom: 20px;} #recruit .bg .job .info h6{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 18px;font-weight: bold; color: #000000;margin-bottom: 20px;} #recruit .bg .job .info .text{font-size: 14px;line-height: 24px;} #recruit .bg .job .pic{float: right;} #recruit .bg .gallery{margin-bottom: 60px;} #recruit .bg .gallery h4{width: 338px;margin: 0 auto 20px;} #recruit .bg .gallery ul{overflow: hidden;} #recruit .bg .gallery ul li{float: left;margin-right: 30px;} #recruit .bg .gallery ul li:nth-child(3){margin-right: 0px;} #recruit .bg table{} #recruit .bg table tr th{width: 200px; border: 1px solid #000000;padding: 30px;font-weight: bold;text-align: center;background-color: #f5f5f5;} #recruit .bg table tr td{border: 1px solid #000000;padding: 30px;} #other{width: 1100px;margin: 0 auto 80px;position: relative;} #other h3{position: absolute;top: -148px;left: 0px;right: 0px;text-align: center;} #other .box{background-color: #e5d197;padding: 50px 30px 20px;} #other .box ul{overflow: hidden;padding-bottom: 30px;} #other .box ul li{width: 500px;float: left; background-color: #e7e7e7; border: 1px solid #000000;position: relative;} #other .box ul li .pic{width: 196px; float: right;} #other .box ul li .info{width: 300px;float: left;padding: 20px;} #other .box ul li .info h4{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 16px;font-weight: bold;text-align: center; color: #ffffff;background-color: #3b4137;padding: 5px 0;margin-bottom: 15px;} #other .box ul li .info .text{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 16px;font-weight: bold;line-height: 30px;text-decoration: underline;} #other .box ul li .info .text:hover{text-decoration: none;} #other .box ul li .icon{position: absolute;left: 0px;right: 0px;bottom:-20px;text-align: center;margin: 0 auto;} #other .box ul li:nth-child(2){float: right;} } @media screen and (max-width: 767px) { /* SP */ #message{width: 90%;margin: 0 auto 18%;padding-top: 8%;} #message h3{width: 90%;margin: 0 auto 8%;} #message h3 img{width: 100%;} #message .info{font-size: 1.0em;margin-bottom: 5%;} #message .info .text-space{margin-bottom: 5%;} #message .pic{margin-bottom: 5%;} #message .btn{width: 90%;margin: 0 auto;} #message .btn img{width: 100%;} #greeting{width: 90%;margin: 0 auto 18%;} #greeting .info h3{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.8em;line-height: 1.4em; font-weight: bold;color: #fca700;margin-bottom: 3%;} #greeting .info .pic{width: 90%;margin: 0 auto 5%;} #greeting .info h4{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.2em;line-height: 1.6em; font-weight: bold;color: #000000;margin-bottom: 3%;} #greeting .info .text{font-size: 1.0em;margin-bottom: 5%;} #greeting .stance{border: 5px solid #000000;padding: 5%;margin-bottom: 5%;} #greeting .stance li{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.0em;font-weight: bold;color: #000000;position: relative;margin-left: 40px; margin-bottom: 3%;} #greeting .stance li:before{content: url(../images/reform/icon01.png);position: absolute;left: -40px;top: 0px;} #greeting .comment{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.2em;font-weight: bold;text-align: center; color: #ffffff; background-color: #2a4b14;padding: 5%;} #interview{width: 90%;margin: 0 auto 18%;} #interview h3{width: 100%;margin: 0 auto 5%;} #interview .sub{font-size: 1.0em;line-height: 1.6em;margin-bottom: 5%;text-align: center;} #interview .staff{margin-bottom: 5%;} #interview .staff .info{padding: 5%;width: 100%;background-color: #2a4b14;} #interview .staff .info h4{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.6em;font-weight: bold;color: #ffffff;margin-bottom: 2%;} #interview .staff .info h5{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.0em;color: #ffffff;margin-bottom: 5%;} #interview .staff .info .year{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;background-color: #ffffff;font-size: 1.0em;font-weight: bold; text-align: center;margin-bottom: 5%} #interview .staff .info .text{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.2em;line-height: 1.8em;color: #fff;} #interview .btn{width: 369px;margin: 0 auto;} #interview .btn{width: 90%;margin: 0 auto;} #interview .btn img{width: 100%;} #flow{width: 90%;margin: 0 auto 18%;border: 5px solid #000000;padding: 3%;} #flow h3{width: 90%;margin: 0 auto 5%;} #flow .bg{background-color: #f0f0f0;padding: 5%;} #flow .pic{width: 100%;margin-bottom: 10%;} #flow .flow{width: 100%;} #recruit{width: 90%;margin: 0 auto 18%;background-color: #0a0b24;padding: 3%;} #recruit h3{width: 60%;margin: 0 auto 5%;} #recruit .bg{background-color: #ffffff;padding: 5%;} #recruit .bg .job{margin-bottom: 10%;} #recruit .bg .job .info{width: 100%;} #recruit .bg .job .info h4{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.4em;font-weight: bold;text-align: center; color: #000000;margin-bottom: 5%;background-color: #f39900;padding: 3%;line-height: 1.4em;} #recruit .bg .job .info h5{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.4em;font-weight: bold; color: #000000;margin-bottom: 5%;line-height: 1.4em;} #recruit .bg .job .info h6{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 1.2em;font-weight: bold; color: #000000;margin-bottom: 5%;} #recruit .bg .job .info .text{font-size: 1.0em;line-height: 1.6em;margin-bottom: 5%;} #recruit .bg .gallery{margin-bottom: 10%;} #recruit .bg .gallery h4{width: 90%;margin: 0 auto 5%;} #recruit .bg .gallery ul li{width: 48%; float: left;margin-bottom: 5%;} #recruit .bg .gallery ul li:nth-child(2){float: right;} #recruit .bg .gallery ul li:nth-child(3){float: none;margin: 0 auto;} #recruit .bg table tr th{display: block;width: 100%; border: 1px solid #000000;padding: 5%;font-weight: bold;text-align: center;background-color: #f5f5f5;} #recruit .bg table tr td{display: block;width: 100%; border: 1px solid #000000;padding: 5%;} #other{width: 90%;margin: 0 auto 18%;} #other h3{width: 100%;margin: 0 auto 5%;} #other .box{background-color: #e5d197;padding: 3%;} #other .box ul{overflow: hidden;} #other .box ul li{width: 48%;float: left;background-color: #e7e7e7; border: 1px solid #000000;} #other .box ul li:nth-child(2){float: right;} #other .box ul li .pic{width: 100%; margin-bottom: 5%;} #other .box ul li .info{padding: 5%;} #other .box ul li .info h4{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 0.8em;font-weight: bold;text-align: center; color: #ffffff;background-color: #3b4137;padding: 3%;margin-bottom: 5%;} #other .box ul li .info .text{font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;font-size: 0.8em;font-weight: bold;line-height: 1.4em;text-decoration: underline;} #other .box ul li .icon{width: 20%;margin: 0 auto 5%;} #other .box ul li .icon img{width: 100%;} } /* ▽ イレギュラー箇所のみ追記 ▽ */ @media screen and (max-width: 380px) { /* SP iPhone 6/7/8 */ } @media screen and (max-width: 321px) { /* SP iPhone 5/SE */ }