@charset "UTF-8";
/* Scss Document */
@-moz-keyframes bounce-down { from { transform: translateY(0); }
  to { transform: translateY(3.5vh); } }
@-webkit-keyframes bounce-down { from { transform: translateY(0); }
  to { transform: translateY(3.5vh); } }
@keyframes bounce-down { from { transform: translateY(0); }
  to { transform: translateY(3.5vh); } }
/*==============================
	Reset
==============================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

/*==============================
	Base
==============================*/
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

html { font-size: 62.5%; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }

body { text-align: center; color: #000; background: #fff; }
@media screen and (min-width: 750px) { body { font-size: 1.8rem; } }
@media screen and (max-width: 749px) { body { font-size: 1.4rem; } }

img { border: none; }
@media screen and (max-width: 749px) { img { max-width: 100%; height: auto; width: auto; } }

a { text-decoration: none; }

a, a img { -moz-transition: ease-in-out 0.3s; -o-transition: ease-in-out 0.3s; -webkit-transition: ease-in-out 0.3s; transition: ease-in-out 0.3s; }

a:hover, a:hover img { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; }

ul, li { list-style: none; }

section { width: 100%; }

/*==============================
	Object
==============================*/
/* Common
---------------------------------------------*/
@media screen and (max-width: 749px) { .pc { display: none; } }

@media screen and (min-width: 750px) { .sp { display: none; } }

.txt, .philosophy dl dd, .philosophy div.policy ul li, .philosophy div.conducts ul li { color: #282828; }

.ttl, .philosophy dl dt, .philosophy div.conducts p { color: #bb1f2c; font-family: YuMincho, 'Yu Mincho', "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif", sans-serif; font-weight: bold; }

.section, .slide { height: 100vh; }

.head { width: 100%; background: #000; padding: 2% 0; position: absolute; top: 0; left: 0; }
.head h2 { color: #fff; margin-bottom: 0; }

.ribbon { width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 0; margin: 0; }

.wrap { overflow-y: auto; -webkit-overflow-scrolling: touch; }

table { width: 100%; line-height: 1.4em; }
@media screen and (min-width: 750px) { table { font-size: 1.5rem; } }
@media screen and (max-width: 749px) { table { font-size: 1.2rem; } }
table th, table td { border-bottom: dashed 1px #999; }
@media screen and (min-width: 750px) { table th, table td { padding: 1%; } }
@media screen and (max-width: 749px) { table th, table td { padding: 2%; } }
table th.firsrt, table td.firsrt { border-top: solid 1px #999; }
table th.last, table td.last { border-bottom: solid 1px #999; }
table th { width: 30%; background: #eee; border-left: solid 1px #999; border-right: solid 1px #999; }
table td { border-right: solid 1px #999; }
table td span { font-size: 90%; color: #282828; }

ul.btn { display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; }
@media screen and (min-width: 750px) { ul.btn { width: 40%; margin: 2% auto; } }
@media screen and (max-width: 749px) { ul.btn { width: 90%; margin: 5% auto; } }
ul.btn li { width: 45%; }
ul.btn li a { width: 100%; padding: 20px; display: inline-block; color: #fff; }
ul.btn li a span { display: block; margin-top: .2em; }

/* Headings
---------------------------------------------*/
h1 { font-family: 'Roboto', sans-serif; color: #bb1f2c; line-height: 1em; position: absolute; z-index: 15; top: 0; }
@media screen and (min-width: 750px) { h1 { font-size: 12rem; left: 5%; } }
@media screen and (max-width: 749px) { h1 { width: 100%; font-size: 5rem; text-align: center; padding-top: 5px; } }

h2, h3 { font-family: YuMincho, 'Yu Mincho', "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif", sans-serif; font-weight: bold; position: relative; }
h2 span, h3 span { font-family: 'Roboto', sans-serif; color: #999; font-weight: 300; }

h2 { display: inline-block; margin: 0 auto; }
@media screen and (min-width: 750px) { h2 { font-size: 3.6rem; margin-bottom: 30px; } }
@media screen and (max-width: 749px) { h2 { font-size: 2.4rem; margin-bottom: 15px; } }
h2::after { position: absolute; content: ""; background: #bb1f2c; }
@media screen and (min-width: 750px) { h2::after { width: 80px; height: 5px; top: calc(3.6rem + 20px); left: calc(50% - 40px); } }
@media screen and (max-width: 749px) { h2::after { width: 50px; height: 3px; top: calc(2.4rem + 10px); left: calc(50% - 25px); } }
h2 span { display: block; }
@media screen and (min-width: 750px) { h2 span { font-size: 1.6rem; margin-top: 45px; } }
@media screen and (max-width: 749px) { h2 span { font-size: 1.4rem; margin-top: 23px; } }

@media screen and (min-width: 750px) { h3 { font-size: 3rem; margin-bottom: 30px; padding-left: 20px; } }
@media screen and (max-width: 749px) { h3 { font-size: 1.8rem; margin-bottom: 15px; padding-left: 13px; } }
h3::before { position: absolute; content: ""; background: #bb1f2c; left: 0; }
@media screen and (min-width: 750px) { h3::before { width: 5px; height: 40px; top: calc(50% - 20px); } }
@media screen and (max-width: 749px) { h3::before { width: 3px; height: 30px; top: calc(50% - 15px); } }
@media screen and (min-width: 750px) { h3 span { font-size: 1.4rem; margin-left: 15px; } }
@media screen and (max-width: 749px) { h3 span { font-size: 1.2rem; margin-left: 10px; } }

h4 { font-family: YuMincho, 'Yu Mincho', "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif", sans-serif; line-height: 1.4em; padding-bottom: 1.5em; }
@media screen and (min-width: 750px) { h4 { font-size: 2.4rem; } }
@media screen and (max-width: 749px) { h4 { font-size: 1.8rem; } }
h4 span { display: block; padding-top: 1em; font-size: 1.4rem; }

/* Buttons
---------------------------------------------*/
/*==============================
	Layout
==============================*/
/* Header
---------------------------------------------*/
header nav { text-align: left; }
@media screen and (min-width: 750px) { header nav { padding: 1.5%; } }
@media screen and (max-width: 749px) { header nav { padding: 5%; } }
header nav ul li { padding-bottom: 10%; border-bottom: dashed 1px #000; margin-bottom: 10%; }
header nav ul li a { display: block; color: #000; cursor: pointer; }
header nav ul li p { cursor: pointer; }
header nav ul li span::after { font-family: FontAwesome; content: "\f0d7"; margin-left: 1em; }
header nav ul li ul li { border: none; font-size: 90%; padding-bottom: 0; margin-bottom: 0; margin-top: .5em; }
header nav ul li ul li a::before { font-family: FontAwesome; content: "\f0da"; margin-right: .5em; }
header nav ul li ul li a:hover { text-decoration: none !important; }

/* Top
---------------------------------------------*/
.top { background: url(../img/leftTop.png) no-repeat, url(../img/rightBtm.png) no-repeat; background-position: left top, right bottom; position: relative; }
.top h1 { top: 50%; left: 50%; padding: 0; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.top img { position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
@media screen and (max-width: 749px) { .top img { width: 60%; } }
.top .scroll { font-family: 'Roboto', sans-serif; -moz-animation: bounce-down 1.5s ease infinite; -webkit-animation: bounce-down 1.5s ease infinite; animation: bounce-down 1.5s ease infinite; position: absolute; color: #1C2A55; }
@media screen and (min-width: 750px) { .top .scroll { bottom: 10%; left: calc(50% - 15px); } }
@media screen and (max-width: 749px) { .top .scroll { bottom: 15%; left: calc(50% - 15px); } }
.top .scroll span { font-size: 1.6rem; position: relative; }
.top .scroll span::after { position: absolute; content: ""; width: 30px; height: 30px; border: 2px solid; border-color: transparent transparent #1C2A55 #1C2A55; transform: rotate(-45deg); left: calc(50% - 1.1em); bottom: -20px; }

.philosophy { background: url(../img/leftBtm.png) no-repeat, url(../img/rightTop.png) no-repeat; background-position: left bottom, right top; }
@media screen and (max-width: 749px) { .philosophy { -moz-background-size: 50%, 50%; -o-background-size: 50%, 50%; -webkit-background-size: 50%, 50%; background-size: 50%, 50%; } }
@media screen and (min-width: 750px) { .philosophy dl dt { font-size: 4.8rem; margin-bottom: 30px; } }
@media screen and (max-width: 749px) { .philosophy dl dt { font-size: 2.4rem; margin-bottom: 15px; } }
@media screen and (max-width: 749px) { .philosophy dl dd { line-height: 1.2em; } }
.philosophy div.policy, .philosophy div.conducts { margin: 0 auto; text-align: left; }
@media screen and (min-width: 750px) { .philosophy div.policy, .philosophy div.conducts { width: 750px; min-height: 250px; margin-top: 7vh; } }
@media screen and (max-width: 749px) { .philosophy div.policy, .philosophy div.conducts { width: 60%; margin-top: 3.5vh; } }
@media screen and (min-width: 750px) { .philosophy div.policy ul, .philosophy div.conducts ul { padding-left: 30px; } }
@media screen and (max-width: 749px) { .philosophy div.policy ul, .philosophy div.conducts ul { padding-left: 15px; } }
.philosophy div.policy ul li, .philosophy div.conducts ul li { font-weight: 500; }
@media screen and (min-width: 750px) { .philosophy div.policy ul li, .philosophy div.conducts ul li { margin-bottom: 15px; } }
@media screen and (max-width: 749px) { .philosophy div.policy ul li, .philosophy div.conducts ul li { margin-bottom: 10px; } }
.philosophy div.policy ul li:last-child, .philosophy div.conducts ul li:last-child { margin-bottom: 0; }
@media screen and (min-width: 750px) { .philosophy div.policy { background: url(../img/policy.png) no-repeat right top; padding-right: 390px; } }
@media screen and (min-width: 750px) { .philosophy div.policy ul li { font-size: 2.4rem; } }
@media screen and (max-width: 749px) { .philosophy div.policy ul li { font-size: 1.6rem; } }
@media screen and (min-width: 750px) { .philosophy div.conducts { background: url(../img/conducts.png) no-repeat left top; padding-left: 390px; } }
@media screen and (min-width: 750px) { .philosophy div.conducts p { font-size: 2.4rem; margin-bottom: 30px; } }
@media screen and (max-width: 749px) { .philosophy div.conducts p { font-size: 1.8rem; margin-bottom: 15px; } }

/* Recruit
---------------------------------------------*/
.recruit { background: url(../img/recruit_bg.png) no-repeat center top; -moz-background-size: auto 100%; -o-background-size: auto 100%; -webkit-background-size: auto 100%; background-size: auto 100%; position: relative; }
.recruit dl { position: absolute; bottom: 0; left: 50%; -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); }
@media screen and (max-width: 749px) { .recruit dl { width: 100%; }
  .recruit dl dt, .recruit dl dd { margin: 0 auto; }
  .recruit dl dt { width: 75%; }
  .recruit dl dd { width: 95%; } }

.interview { position: relative; text-align: left; }
.interview .ribbon { background: url(../img/ribbon-01.png) no-repeat center top; -moz-background-size: auto 100%; -o-background-size: auto 100%; -webkit-background-size: auto 100%; background-size: auto 100%; }
@media screen and (min-width: 750px) { .interview .ribbon { z-index: 4; } }
.interview .fp-controlArrow { z-index: 20; margin-top: 0 !important; }
@media screen and (min-width: 750px) { .interview .fp-controlArrow { -moz-transform: translateY(-50% !important); -ms-transform: translateY(-50% !important); -webkit-transform: translateY(-50% !important); transform: translateY(-50% !important); } }
@media screen and (max-width: 749px) { .interview .fp-controlArrow { top: 3% !important; } }
.interview .fp-prev { border-width: 15px 20px 15px 0 !important; border-color: transparent #bb1f2c transparent transparent !important; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; }
@media screen and (min-width: 750px) { .interview .fp-prev { left: 1% !important; } }
@media screen and (max-width: 749px) { .interview .fp-prev { left: 15% !important; } }
.interview .fp-next { border-width: 15px 0 15px 20px !important; border-color: transparent transparent transparent #bb1f2c !important; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); opacity: 0.7; }
@media screen and (min-width: 750px) { .interview .fp-next { right: 1% !important; } }
@media screen and (max-width: 749px) { .interview .fp-next { right: 15% !important; } }
.interview #slide1 { width: 100%; height: 100vh; }
@media screen and (min-width: 750px) { .interview #slide1 { background: url(../img/interview-01.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; } }
@media screen and (max-width: 749px) { .interview #slide1 { z-index: 1; }
  .interview #slide1::after { position: absolute; content: ""; width: 100%; height: 100vh; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: -1; background: url(../img/sp/interview-01.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); opacity: 0.6; } }
.interview #slide2 { width: 100%; height: 100vh; }
@media screen and (min-width: 750px) { .interview #slide2 { background: url(../img/interview-02.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; } }
@media screen and (max-width: 749px) { .interview #slide2 { z-index: 1; }
  .interview #slide2::after { position: absolute; content: ""; width: 100%; height: 100vh; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: -1; background: url(../img/sp/interview-02.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); opacity: 0.6; } }
.interview #slide3 { width: 100%; height: 100vh; }
@media screen and (min-width: 750px) { .interview #slide3 { background: url(../img/interview-03.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; } }
@media screen and (max-width: 749px) { .interview #slide3 { z-index: 1; }
  .interview #slide3::after { position: absolute; content: ""; width: 100%; height: 100vh; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: -1; background: url(../img/sp/interview-03.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); opacity: 0.6; } }
.interview #slide4 { width: 100%; height: 100vh; }
@media screen and (min-width: 750px) { .interview #slide4 { background: url(../img/interview-04.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; } }
@media screen and (max-width: 749px) { .interview #slide4 { z-index: 1; }
  .interview #slide4::after { position: absolute; content: ""; width: 100%; height: 100vh; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: -1; background: url(../img/sp/interview-04.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); opacity: 0.6; } }
.interview #slide5 { width: 100%; height: 100vh; }
@media screen and (min-width: 750px) { .interview #slide5 { background: url(../img/interview-05.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; } }
@media screen and (max-width: 749px) { .interview #slide5 { z-index: 1; }
  .interview #slide5::after { position: absolute; content: ""; width: 100%; height: 100vh; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: -1; background: url(../img/sp/interview-05.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); opacity: 0.6; } }
.interview #slide6 { width: 100%; height: 100vh; }
@media screen and (min-width: 750px) { .interview #slide6 { background: url(../img/interview-06.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; } }
@media screen and (max-width: 749px) { .interview #slide6 { z-index: 1; }
  .interview #slide6::after { position: absolute; content: ""; width: 100%; height: 100vh; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: -1; background: url(../img/sp/interview-06.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); opacity: 0.6; } }
.interview #slide7 { width: 100%; height: 100vh; }
@media screen and (min-width: 750px) { .interview #slide7 { background: url(../img/interview-07.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; } }
@media screen and (max-width: 749px) { .interview #slide7 { z-index: 1; }
  .interview #slide7::after { position: absolute; content: ""; width: 100%; height: 100vh; position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: -1; background: url(../img/sp/interview-07.jpg) no-repeat center top; -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60); opacity: 0.6; } }
.interview div[id^="slide"] { position: relative; }
.interview div[id^="slide"] .txt, .interview div[id^="slide"] .philosophy dl dd, .philosophy dl .interview div[id^="slide"] dd, .interview div[id^="slide"] .philosophy div.policy ul li, .philosophy div.policy ul .interview div[id^="slide"] li, .interview div[id^="slide"] .philosophy div.conducts ul li, .philosophy div.conducts ul .interview div[id^="slide"] li { position: absolute; z-index: 100; text-shadow: 1px 1px 5px #fff; }
@media screen and (max-width: 749px) { .interview div[id^="slide"] .txt, .interview div[id^="slide"] .philosophy dl dd, .philosophy dl .interview div[id^="slide"] dd, .interview div[id^="slide"] .philosophy div.policy ul li, .philosophy div.policy ul .interview div[id^="slide"] li, .interview div[id^="slide"] .philosophy div.conducts ul li, .philosophy div.conducts ul .interview div[id^="slide"] li { width: 90%; left: 5%; bottom: 15%; display: inline-block; } }
.interview div[id^="slide"] .txt p, .interview div[id^="slide"] .philosophy dl dd p, .philosophy dl .interview div[id^="slide"] dd p, .interview div[id^="slide"] .philosophy div.policy ul li p, .philosophy div.policy ul .interview div[id^="slide"] li p, .interview div[id^="slide"] .philosophy div.conducts ul li p, .philosophy div.conducts ul .interview div[id^="slide"] li p { text-align: justify; line-height: 1.5em; }
@media screen and (min-width: 750px) { .interview div[id^="slide"] .txt p, .interview div[id^="slide"] .philosophy dl dd p, .philosophy dl .interview div[id^="slide"] dd p, .interview div[id^="slide"] .philosophy div.policy ul li p, .philosophy div.policy ul .interview div[id^="slide"] li p, .interview div[id^="slide"] .philosophy div.conducts ul li p, .philosophy div.conducts ul .interview div[id^="slide"] li p { font-size: 1.6rem; } }
@media screen and (max-width: 749px) { .interview div[id^="slide"] .txt p, .interview div[id^="slide"] .philosophy dl dd p, .philosophy dl .interview div[id^="slide"] dd p, .interview div[id^="slide"] .philosophy div.policy ul li p, .philosophy div.policy ul .interview div[id^="slide"] li p, .interview div[id^="slide"] .philosophy div.conducts ul li p, .philosophy div.conducts ul .interview div[id^="slide"] li p { font-size: 1.2rem; } }
@media screen and (min-width: 750px) { .interview div #slide1 .txt, .interview div #slide1 .philosophy dl dd, .philosophy dl .interview div #slide1 dd, .interview .philosophy div.policy #slide1 ul li, .philosophy .interview div.policy #slide1 ul li, .interview .philosophy div.policy ul #slide1 li, .philosophy .interview div.policy ul #slide1 li, .interview .philosophy div.conducts #slide1 ul li, .philosophy .interview div.conducts #slide1 ul li, .interview .philosophy div.conducts ul #slide1 li, .philosophy .interview div.conducts ul #slide1 li, .interview div #slide7 .txt, .interview div #slide7 .philosophy dl dd, .philosophy dl .interview div #slide7 dd, .interview .philosophy div.policy #slide7 ul li, .philosophy .interview div.policy #slide7 ul li, .interview .philosophy div.policy ul #slide7 li, .philosophy .interview div.policy ul #slide7 li, .interview .philosophy div.conducts #slide7 ul li, .philosophy .interview div.conducts #slide7 ul li, .interview .philosophy div.conducts ul #slide7 li, .philosophy .interview div.conducts ul #slide7 li { width: 40%; left: 8%; top: 20%; }
  .interview div #slide2 .txt, .interview div #slide2 .philosophy dl dd, .philosophy dl .interview div #slide2 dd, .interview .philosophy div.policy #slide2 ul li, .philosophy .interview div.policy #slide2 ul li, .interview .philosophy div.policy ul #slide2 li, .philosophy .interview div.policy ul #slide2 li, .interview .philosophy div.conducts #slide2 ul li, .philosophy .interview div.conducts #slide2 ul li, .interview .philosophy div.conducts ul #slide2 li, .philosophy .interview div.conducts ul #slide2 li, .interview div #slide3 .txt, .interview div #slide3 .philosophy dl dd, .philosophy dl .interview div #slide3 dd, .interview .philosophy div.policy #slide3 ul li, .philosophy .interview div.policy #slide3 ul li, .interview .philosophy div.policy ul #slide3 li, .philosophy .interview div.policy ul #slide3 li, .interview .philosophy div.conducts #slide3 ul li, .philosophy .interview div.conducts #slide3 ul li, .interview .philosophy div.conducts ul #slide3 li, .philosophy .interview div.conducts ul #slide3 li, .interview div #slide4 .txt, .interview div #slide4 .philosophy dl dd, .philosophy dl .interview div #slide4 dd, .interview .philosophy div.policy #slide4 ul li, .philosophy .interview div.policy #slide4 ul li, .interview .philosophy div.policy ul #slide4 li, .philosophy .interview div.policy ul #slide4 li, .interview .philosophy div.conducts #slide4 ul li, .philosophy .interview div.conducts #slide4 ul li, .interview .philosophy div.conducts ul #slide4 li, .philosophy .interview div.conducts ul #slide4 li, .interview div #slide5 .txt, .interview div #slide5 .philosophy dl dd, .philosophy dl .interview div #slide5 dd, .interview .philosophy div.policy #slide5 ul li, .philosophy .interview div.policy #slide5 ul li, .interview .philosophy div.policy ul #slide5 li, .philosophy .interview div.policy ul #slide5 li, .interview .philosophy div.conducts #slide5 ul li, .philosophy .interview div.conducts #slide5 ul li, .interview .philosophy div.conducts ul #slide5 li, .philosophy .interview div.conducts ul #slide5 li, .interview div #slide6 .txt, .interview div #slide6 .philosophy dl dd, .philosophy dl .interview div #slide6 dd, .interview .philosophy div.policy #slide6 ul li, .philosophy .interview div.policy #slide6 ul li, .interview .philosophy div.policy ul #slide6 li, .philosophy .interview div.policy ul #slide6 li, .interview .philosophy div.conducts #slide6 ul li, .philosophy .interview div.conducts #slide6 ul li, .interview .philosophy div.conducts ul #slide6 li, .philosophy .interview div.conducts ul #slide6 li { width: 27%; right: 8%; }
  .interview div #slide2 .txt, .interview div #slide2 .philosophy dl dd, .philosophy dl .interview div #slide2 dd, .interview .philosophy div.policy #slide2 ul li, .philosophy .interview div.policy #slide2 ul li, .interview .philosophy div.policy ul #slide2 li, .philosophy .interview div.policy ul #slide2 li, .interview .philosophy div.conducts #slide2 ul li, .philosophy .interview div.conducts #slide2 ul li, .interview .philosophy div.conducts ul #slide2 li, .philosophy .interview div.conducts ul #slide2 li, .interview div #slide4 .txt, .interview div #slide4 .philosophy dl dd, .philosophy dl .interview div #slide4 dd, .interview .philosophy div.policy #slide4 ul li, .philosophy .interview div.policy #slide4 ul li, .interview .philosophy div.policy ul #slide4 li, .philosophy .interview div.policy ul #slide4 li, .interview .philosophy div.conducts #slide4 ul li, .philosophy .interview div.conducts #slide4 ul li, .interview .philosophy div.conducts ul #slide4 li, .philosophy .interview div.conducts ul #slide4 li { top: 10%; }
  .interview div #slide3 .txt, .interview div #slide3 .philosophy dl dd, .philosophy dl .interview div #slide3 dd, .interview .philosophy div.policy #slide3 ul li, .philosophy .interview div.policy #slide3 ul li, .interview .philosophy div.policy ul #slide3 li, .philosophy .interview div.policy ul #slide3 li, .interview .philosophy div.conducts #slide3 ul li, .philosophy .interview div.conducts #slide3 ul li, .interview .philosophy div.conducts ul #slide3 li, .philosophy .interview div.conducts ul #slide3 li { bottom: 6%; }
  .interview div #slide5 .txt, .interview div #slide5 .philosophy dl dd, .philosophy dl .interview div #slide5 dd, .interview .philosophy div.policy #slide5 ul li, .philosophy .interview div.policy #slide5 ul li, .interview .philosophy div.policy ul #slide5 li, .philosophy .interview div.policy ul #slide5 li, .interview .philosophy div.conducts #slide5 ul li, .philosophy .interview div.conducts #slide5 ul li, .interview .philosophy div.conducts ul #slide5 li, .philosophy .interview div.conducts ul #slide5 li, .interview div #slide6 .txt, .interview div #slide6 .philosophy dl dd, .philosophy dl .interview div #slide6 dd, .interview .philosophy div.policy #slide6 ul li, .philosophy .interview div.policy #slide6 ul li, .interview .philosophy div.policy ul #slide6 li, .philosophy .interview div.policy ul #slide6 li, .interview .philosophy div.conducts #slide6 ul li, .philosophy .interview div.conducts #slide6 ul li, .interview .philosophy div.conducts ul #slide6 li, .philosophy .interview div.conducts ul #slide6 li { bottom: 10%; } }

.message { -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; position: relative; text-align: left; }
@media screen and (min-width: 750px) { .message { background: url(../img/message.jpg) no-repeat center top; } }
@media screen and (max-width: 749px) { .message { background: url(../img/sp/message.jpg) no-repeat center top; } }
.message .ribbon { background: url(../img/ribbon-02.png) no-repeat center top; -moz-background-size: auto 100%; -o-background-size: auto 100%; -webkit-background-size: auto 100%; background-size: auto 100%; }
.message .inner { position: absolute; z-index: 10; }
@media screen and (min-width: 750px) { .message .inner { width: 30%; left: 5%; top: 20%; } }
@media screen and (max-width: 749px) { .message .inner { width: 90%; left: 5%; bottom: 15%; } }
.message .inner h4, .message .inner p { color: #fff; text-shadow: 1px 1px 5px #000; }
.message .inner p { text-align: justify; line-height: 1.5em; overflow: hidden; *zoom: 1; }
@media screen and (min-width: 750px) { .message .inner p { font-size: 1.6rem; } }
@media screen and (max-width: 749px) { .message .inner p { font-size: 1.2rem; } }
.message .inner p img { float: right; margin-top: .5em; }
@media screen and (max-width: 749px) { .message .inner p img { width: 50%; } }

.flow, .requirements { position: relative; }
.flow .inner, .requirements .inner { position: absolute; top: 50%; left: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background: rgba(255, 255, 255, 0.9); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); }
@media screen and (min-width: 750px) { .flow .inner, .requirements .inner { padding: 2%; } }
@media screen and (max-width: 749px) { .flow .inner, .requirements .inner { width: 90%; padding: 5%; } }
.flow .inner p, .requirements .inner p { text-align: justify; line-height: 1.5em; margin-bottom: 2em; }

.flow { background: url(../img/ribbon-03.png) no-repeat center top; -moz-background-size: auto 100%; -o-background-size: auto 100%; -webkit-background-size: auto 100%; background-size: auto 100%; }
@media screen and (min-width: 750px) { .flow { font-size: 90%; } }
@media screen and (max-width: 749px) { .flow { font-size: 80%; } }
.flow .wrap { font-size: 90%; }
@media screen and (max-width: 749px) { .flow .wrap { max-height: 50px; } }

.requirements { background: url(../img/ribbon-02.png) no-repeat center top; -moz-background-size: auto 100%; -o-background-size: auto 100%; -webkit-background-size: auto 100%; background-size: auto 100%; }
.requirements .inner { height: 80%; }
@media screen and (min-width: 750px) { .requirements .wrap { height: calc(95% - 3.6rem - 65px); } }
@media screen and (max-width: 749px) { .requirements .wrap { height: calc(95% - 2.4rem - 33px); } }

.entry { background: url(../img/entry_bg.png) no-repeat center top; -moz-background-size: auto 100%; -o-background-size: auto 100%; -webkit-background-size: auto 100%; background-size: auto 100%; }
@media screen and (min-width: 750px) { .entry h5 { padding-top: 25%; } }
@media screen and (max-width: 749px) { .entry h5 { width: 80%; margin: 0 auto; padding-top: 40%; } }
@media screen and (min-width: 750px) { .entry ul.btn li a { font-size: 3rem; } }
@media screen and (max-width: 749px) { .entry ul.btn li a { font-size: 1.6rem; padding: 20px 10px;} }
.entry ul.btn li a span { font-family: 'Roboto', sans-serif; }
@media screen and (min-width: 750px) { .entry ul.btn li a span { font-size: 6rem; } }
@media screen and (max-width: 749px) { .entry ul.btn li a span { font-size: 4rem; } }
.entry ul.btn li a small { display: block; }
@media screen and (min-width: 750px) { .entry ul.btn li a small { font-size: 1.8rem; margin-top: 10px; } }
@media screen and (max-width: 749px) { .entry ul.btn li a small { font-size: 1.2rem; margin-top: 6px; } }
.entry ul.btn li:first-child a { background: #bb1f2c; }
.entry ul.btn li:nth-child(2) a { background: #1C2A55; }
.entry ul.btn li:nth-child(2) a:first-child { margin-bottom: 20px; }
.entry p a { color: #bb1f2c; }

.greeting { -moz-background-size: cover !important; -o-background-size: cover !important; -webkit-background-size: cover !important; background-size: cover !important; position: relative; text-align: left; }
@media screen and (min-width: 750px) { .greeting { background: url(../img/greeting.jpg) no-repeat center top; } }
@media screen and (max-width: 749px) { .greeting { background: url(../img/sp/greeting.jpg) no-repeat center top; } }
.greeting .inner { position: absolute; z-index: 10; }
@media screen and (min-width: 750px) { .greeting .inner { width: 30%; left: 5%; top: 20%; } }
@media screen and (max-width: 749px) { .greeting .inner { width: 90%; left: 5%; bottom: 5%; } }
.greeting .inner h4, .greeting .inner p { color: #fff; text-shadow: 1px 1px 5px #000; }
.greeting .inner p { text-align: justify; line-height: 1.5em; overflow: hidden; *zoom: 1; }
@media screen and (min-width: 750px) { .greeting .inner p { font-size: 1.6rem; } }
@media screen and (max-width: 749px) { .greeting .inner p { font-size: 1.2rem; } }
.greeting .inner p img { float: right; margin-top: .5em; }
@media screen and (max-width: 749px) { .greeting .inner p img { width: 50%; } }

/* Service
---------------------------------------------*/
.service { position: relative; }
.service p { line-height: 1.6em; margin-bottom: 2%; }
@media screen and (min-width: 750px) { .service p { margin-top: 10%; } }
@media screen and (min-width: 750px) { .service img { width: 35%; } }
@media screen and (max-width: 749px) { .service img { width: 98%; margin: 0 auto; padding-top: 3%; } }

/* Company
---------------------------------------------*/
.company .inner, .map .inner, .profile .inner { margin: 0 auto; }
@media screen and (min-width: 750px) { .company .inner, .map .inner, .profile .inner { width: 750px; } }
@media screen and (max-width: 749px) { .company .inner, .map .inner, .profile .inner { width: 95%; } }
.company .inner h3, .map .inner h3, .profile .inner h3 { text-align: left; }
.company .inner img, .map .inner img, .profile .inner img { margin: 0 auto; }
@media screen and (min-width: 750px) { .company .inner img, .map .inner img, .profile .inner img { max-width: 100%; } }

.company { position: relative; }
@media screen and (min-width: 750px) { .company .inner { padding-top: calc(4% + 3.6rem + 30px); } }
@media screen and (min-width: 750px) { .company .inner h3 { margin-top: 30px; } }
@media screen and (max-width: 749px) { .company .inner h3 { margin-top: 20px; } }

@media screen and (min-width: 750px) { .map .inner img { width: 90%; } }

.profile { position: relative; }
@media screen and (min-width: 750px) { .profile ul.btn li a { font-size: 3rem; } }
@media screen and (max-width: 749px) { .profile ul.btn li a { font-size: 1.4rem; } }
.profile ul.btn li a span { font-size: 120%; }
.profile ul.btn li a::before { font-family: FontAwesome; content: "\f0e0"; margin-right: 5px; }
.profile ul.btn li:first-child a { background: #1C2A55; }
.profile ul.btn li:nth-child(2) a { background: #282828; }

/* Contact
---------------------------------------------*/
.contact { position: relative; }
@media screen and (min-width: 750px) { .contact { padding-bottom: 60px; } }
@media screen and (max-width: 749px) { .contact { padding-bottom: 30px; } }
@media screen and (min-width: 750px) { .contact .inner { padding-top: calc(4% + 3.6rem + 95px); } }
@media screen and (max-width: 749px) { .contact .inner { padding-top: calc(4% + 2.4rem + 53px); } }
@media screen and (max-width: 749px) { .contact .inner h3.complete { line-height: 1.2em; } }
.contact .inner h3.complete::before { display: none; }
.contact .inner p { padding: 1.5em 0; line-height: 1.4em; }
.contact .inner p span.note { font-size: 90%; display: block; color: #bb1f2c; margin-top: .5em; }
.contact .inner .confirmBox { border: solid 1px #999; margin-top: 1em; padding: 1em; text-align: left; overflow: auto; }
@media screen and (min-width: 750px) { .contact .inner .confirmBox { height: 200px; } }
@media screen and (max-width: 749px) { .contact .inner .confirmBox { height: 150px; } }
@media screen and (min-width: 750px) { .contact .inner .confirmBox h3 { font-size: 2.4rem; } }
@media screen and (max-width: 749px) { .contact .inner .confirmBox h3 { font-size: 1.6rem; } }
.contact .inner .confirmBox p { margin: 0; text-align: justify; }
@media screen and (min-width: 750px) { .contact .inner .confirmBox p { font-size: 1.6rem; } }
@media screen and (max-width: 749px) { .contact .inner .confirmBox p { font-size: 1.2rem; } }
.contact .inner .confirmBox ol { counter-reset: list; }
.contact .inner .confirmBox ol li { font-weight: 500; font-family: YuMincho, 'Yu Mincho', "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif", sans-serif; margin-top: 1em; }
@media screen and (min-width: 750px) { .contact .inner .confirmBox ol li { font-size: 1.8rem; } }
@media screen and (max-width: 749px) { .contact .inner .confirmBox ol li { font-size: 1.4rem; } }
.contact .inner .confirmBox ol li p { font-weight: 400; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; padding-left: 1em; }
.contact .inner .confirmBox ol li::before { counter-increment: list; content: counter(list) ". "; }
.contact .inner .confirmBox ol li ul { padding-left: 2em; }
.contact .inner .confirmBox ol li ul li { font-weight: 400; margin: 0; text-indent: -1em; margin-left: 1em; margin-top: .5em; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }
@media screen and (min-width: 750px) { .contact .inner .confirmBox ol li ul li { font-size: 1.6rem; } }
@media screen and (max-width: 749px) { .contact .inner .confirmBox ol li ul li { font-size: 1.2rem; } }
.contact .inner .confirmBox ol li ul li::before { counter-increment: none; content: "・"; }

/*==============================
	Form
==============================*/
/* Steps
---------------------------------------------*/
#step { text-align: center; padding-top: 40px; margin-bottom: 3.5vh; }
#step ol { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; counter-reset: step; }
#step ol li { position: relative; font-size: 1.6rem; }
@media screen and (min-width: 750px) { #step ol li { margin-right: 80px; } }
@media screen and (max-width: 749px) { #step ol li { margin-right: 40px; } }
#step ol li span { font-family: YuMincho, 'Yu Mincho', "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif", sans-serif; display: block; font-size: 1.2rem; margin-top: 5px; color: #999; }
#step ol li a::before, #step ol li em::before { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; font-family: YuMincho, 'Yu Mincho', "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif", sans-serif; counter-increment: step; content: counter(step); color: #000; background: #eee; position: absolute; width: 30px; height: 30px; line-height: 30px; font-size: 1.4rem; top: -40px; left: calc(50% - 15px); }
#step ol li::after { position: absolute; content: ""; background: #eee; z-index: -1; height: 5px; top: -27.5px; left: 50%; }
@media screen and (min-width: 750px) { #step ol li::after { width: calc(100% + 80px); } }
@media screen and (max-width: 749px) { #step ol li::after { width: calc(100% + 40px); } }
#step ol li:last-child { margin-right: 0; }
#step ol li:last-child::after { display: none; }
#step ol li.visited a::before { background: #bb1f2c; color: #fff; }
#step ol li.visited::after { background: #bb1f2c; }
#step ol li.current em::before { background: #bb1f2c; color: #fff; }
#step ol li a { padding-top: 40px; color: #bb1f2c; }
#step ol li a:hover { filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; }
#step ol li a:hover::before { -moz-box-shadow: 0 0 0 3px rgba(184, 28, 37, 0.3); -webkit-box-shadow: 0 0 0 3px rgba(184, 28, 37, 0.3); box-shadow: 0 0 0 3px rgba(184, 28, 37, 0.3); }
#step ol li em { padding-top: 40px; font-style: normal; }

/* Form
---------------------------------------------*/
/* Layout ---------------*/
#form { margin: 0 auto; }
@media screen and (min-width: 750px) { #form { width: 750px; } }
@media screen and (max-width: 749px) { #form { width: 95%; } }
#form table { width: 100%; border-collapse: collapse; text-align: left; line-height: 1.6em; }
@media screen and (min-width: 750px) { #form table { font-size: 1.6rem !important; } }
@media screen and (max-width: 749px) { #form table { font-size: 1.4rem !important; } }
@media screen and (max-width: 749px) { #form table tr { border: solid 1px #999; } }
#form table th, #form table td { vertical-align: middle; }
@media screen and (min-width: 750px) { #form table th, #form table td { padding: 15px; border: solid 1px #999; } }
@media screen and (max-width: 749px) { #form table th, #form table td { display: list-item; list-style: none; padding: 10px; border: none; } }
#form table th { background: #eee; color: #000; }
@media screen and (min-width: 750px) { #form table th { width: 30%; } }
@media screen and (max-width: 749px) { #form table th { width: 100%; font-weight: normal; } }
#form table th span::after { color: #fff; text-align: center; line-height: 1em; padding: 2px 5px; margin-left: 10px; font-size: 1.2rem; }
#form table th span.required::after { background: #bb1f2c; content: "必須"; }
#form table th span.option::after { background: #999; content: "任意"; }
@media screen and (min-width: 750px) { #form table td { width: 70%; } }
@media screen and (max-width: 749px) { #form table td { width: 100%; } }
#form table td select { line-height: 1.6em; }
#form table td ul li { display: block; }
@media screen and (min-width: 750px) { #form table td ul li { margin-bottom: 10px; } }
@media screen and (max-width: 749px) { #form table td ul li { margin-bottom: 5px; } }
#form table td ul li:last-child { margin-bottom: 0; }
#form table td ul li::before { display: none; }
#form table td input { width: 100%; }
#form table td input.name { width: calc(50% - 3.2em); }
#form table td input.half { width: 50%; }
#form table td input.zip-3 { width: 20%; }
#form table td input.zip-4 { width: 30%; }
#form table td a { color: #bb1f2c; margin-left: 10px; }
@media screen and (max-width: 749px) { #form table td a { font-size: 1.2rem; } }
#form table td a::after { font-family: FontAwesome; content: "\f08e"; margin-left: 5px; }
#form .submitBtn { display: -webkit-flex; display: flex; -webkit-justify-content: space-around; justify-content: space-around; -webkit-align-items: center; align-items: center; margin: 0 auto; }
@media screen and (min-width: 750px) { #form .submitBtn { width: 60%; margin-top: 1.75vh; } }
@media screen and (max-width: 749px) { #form .submitBtn { width: 80%; margin-top: 15px; } }
#form .submitBtn input[type="submit"], #form .submitBtn button { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; display: inline-block; border: none; color: #fff; background: #000; cursor: pointer; padding: 5px; }
@media screen and (min-width: 750px) { #form .submitBtn input[type="submit"], #form .submitBtn button { width: 200px; height: 50px; font-size: 1.8rem; } }
@media screen and (max-width: 749px) { #form .submitBtn input[type="submit"], #form .submitBtn button { width: 40%; font-size: 1.4rem; } }
#form .submitBtn button.back { background: #999; }
#form .submitBtn input[type="submit"][disabled] { background-color: #ccc; cursor: default; color: #999; }

/* Object ---------------*/
input, select, textarea { padding: 5px; border: solid 1px #ccc; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-appearance: none; -webkit-appearance: none; font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }
@media screen and (min-width: 750px) { input, select, textarea { font-size: 1.6rem; } }
@media screen and (max-width: 749px) { input, select, textarea { font-size: 1.4rem; } }
input:focus, select:focus, textarea:focus { background: #f9f9f9; }

input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -moz-appearance: none; -webkit-appearance: none; margin: 0; }

@media screen and (min-width: 750px) { input[type="number"] { -moz-appearance: textfield; -webkit-appearance: textfield; } }

input[type="checkbox"], input[type="radio"] { display: none; }

label { position: relative; display: inline-block; }
label::after { font-family: FontAwesome; position: absolute; content: "\f107"; right: 10px; top: calc(50% - .5em); pointer-events: none; color: #999; z-index: 5; }
label.select { width: 30%; }
label.selectYear { width: 30%; }
label.selectDate { width: 20%; }
label.checkbox { width: 100%; cursor: pointer; margin-bottom: 10px; }
label.checkbox::after { display: none; }
label.checkbox span.cb::before { font-family: FontAwesome; content: "\f096"; color: #000; margin-right: 5px; }
label.checkbox:last-child { margin-bottom: 0; }
label.checkbox input[type="checkbox"]:checked + .cb::before { font-family: FontAwesome; content: "\f046"; color: #000; }
label.radio { cursor: pointer; margin-right: 10px; }
@media screen and (min-width: 750px) { label.radio { width: 10%; } }
@media screen and (max-width: 749px) { label.radio { width: 15%; } }
label.radio::after { display: none; }
label.radio span.rd::before { font-family: FontAwesome; content: "\f10c"; color: #000; margin-right: 5px; }
label.radio:last-child { margin-bottom: 0; }
label.radio input[type="radio"]:checked + .rd::before { font-family: FontAwesome; content: "\f192"; color: #000; }

select { width: 100%; line-height: 1em; display: table-cell; vertical-align: middle; }

textarea { width: 100%; }
@media screen and (min-width: 750px) { textarea { height: 200px; } }
@media screen and (max-width: 749px) { textarea { height: 100px; } }

::-webkit-input-placeholder { color: #ccc; }

:-moz-placeholder { color: #ccc; }

legend { display: none; }

span.gender { display: block; }

/*# sourceMappingURL=style.css.map */