@charset "utf-8";
/*------------------------------
style.css
------------------------------*/

html,body { height: 100%; }
html { font-size: 62.5%; }
body,
input,
textarea,
select,
button {
	color : #212121;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-size: 12px; font-size: 1.2rem; font-weight: 400; line-height: 1.8;
}
input,
textarea,
select { font-size: 1.6rem; }
a,
button { color: #000; text-decoration: underline; transition: all 0.2s ease 0s; }
a:hover,
button:hover { opacity: 0.8; }

button { background: transparent; }
button:hover { cursor: pointer; }

@media screen and (min-width:768px){
	body { font-size: 1.6rem; }
	input,
	textarea,
	select { font-size: 1.6rem; }
}


/*
layout
-------------------*/
.wrapper { padding-left: 4.5%; padding-right: 4.5%; max-width: 1200px; margin-left: auto; margin-right: auto; }
.wrapper-s { padding-left: 4.5%; padding-right: 4.5%; max-width: 980px; margin-left: auto; margin-right: auto; }
.section-block { padding-top: 4rem; padding-bottom: 4rem; }
.section-block.last { padding-bottom: 1rem; }
.sub-section { padding-top: 3rem; }
.sub-section.last { padding-bottom: 3rem; }

.clearfix { clear: both; zoom: 1; }
.clearfix:after {content: ""; height: 0; display: block; clear: both;}
.row { display: table; width: 100%; }
.inlineblock { display: inline-block; }

@media screen and (max-width:767px){
	.col2 { margin-top: 2em; }
}
@media screen and (min-width:768px){
	.section-block { padding-top: 5rem; padding-bottom: 5rem; }
	.section-block.top { padding-top: 10rem; }
	.section-block.last { padding-bottom: 5rem; }
	.sub-section { padding-top: 3rem; }
	.sub-section.last { padding-bottom: 8rem; }
	.col2 { float: left; width: 46%; margin-right: 8%; }
	.col2:nth-of-type(even) { margin-right: 0; }
}

@media screen and (min-width:1100px){
	.wrapper { padding-left: 0; padding-right: 0; width: 1100px; }
	.wrapper-s { padding-left: 0; padding-right: 0; width: 980px; }
}

/*
parts
-------------------*/
.img-fix { width: 100%; height: auto; }
.img-score { width: 100%; height: auto; margin-bottom: 14vh; }

.header-one {
	display: block; padding-bottom: 1em; margin-bottom: 1em; position: relative;
	font-size: 1.6rem; font-weight: 700; line-height: 1.5; text-align: center ;
}
.header-one.hind { font-size: 1.8rem; font-weight: 600; }
.header-one span { border-bottom: 4px solid #ec5752; padding: 0 10px; letter-spacing: 2px; display: inline-block; }
.header-two {
	background-color: #337bae; padding: 1rem;
	position: absolute; bottom: calc(100% - 1rem); left: -1rem;
}

.header-two-parent { position: relative; margin-top: 4em; }
.header-two-main { color: #fff; display: block; line-height: 1.3; font-weight: bold; font-size: 1.6rem; }
.header-two-sub { color: #fbf30d; display: block; font-weight: bold; }

.contents-paragraph { margin-top: 1em; margin-bottom: 1em; display: block; }
.contents-paragraph:first-of-type { margin-top: 0; }
.content-figure { display: block; margin-bottom: 1em; }
.contents-list-item { list-style: outside disc; padding-left: 0.3em; margin: 0.5em 0 0.5em 1em;}
.slash_inline { width: 1em; height: auto; vertical-align: middle; padding-left: 0.2em; padding-right: 0.2em; }
.mark { padding-left: 1em; text-indent: -1em; }

.fcf { color: #fff; }
.fce { color: #f00; }
.hind { font-family: 'Hind', sans-serif; }
.bold { font-weight: bold; }
.small { font-size: 81.25%; }
.breakword { word-wrap: break-word; }

.btn {
	display: inline-block; position: relative; padding: 0.6em 3em;
	background-color: transparent; color: #377bae; font-weight: bold; border: #377bae 1px solid;
	text-align: center; text-decoration: none;
	background-image: url(../img/); background-repeat: no-repeat; background-position: calc(100% - 5px); background-size: 1.5em 1.5em;
}
.btn:hover { opacity: 1; background-color: #fbf30d; border-color: #fbf30d; color: #212121; background-image: url(../img/); }
.btn-more-wrapper { margin-top: 1.5em; text-align: right; }

.zoom-img { position: relative; }
.zoom-img:after {
	content: "\f00e"; font-family: 'FontAwesome'; color: #337bae; background-color: #fff; border: #337bae 1px solid; text-align: center;
	display: block; width: 1.8em; height: 1.8em; position: absolute; bottom: 5px; right: -5px;
}

.bgg { background-image: url(../img/top-01.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; }
.bg01 { background-image: url(../img/top-02.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; }
.bgye { background-color: #ffe5e5; }
.bglye { background-color: #f8fdf3; }

@media screen and (max-width:767px){
	.break:before { content: "\A"; white-space: pre; }

	.header-two-parent.col2 { margin-top: 6em; }
	.header-two-parent.col2:first-of-type { margin-top: 4em; }
	.header-one { font-size: 1.5rem; }
	.header-one.hind { font-size: 1.5rem; }
	.header-one:after { width: 5rem; }
}
@media screen and (min-width:768px){
	.w-break:before { content: "\A"; white-space: pre; }

	.header-one { font-size: 2.2rem; }
	.header-one.hind { font-size: 3.6rem; }
	.header-one:after { width: 5rem; }
	.header-two { padding: 2rem; bottom: calc(100% - 2rem); left: -2rem; }
	.header-two-parent { margin-top: 5em; }
	.header-two-main { font-size: 3.2rem; }
	.header-two-sub { font-size: 1.4rem; }

	.zoom-img:after { font-size: 2.4rem; }
}

.phone-num { font-size: 155%; font-weight: 600; }
.phone-note { display: block; text-align: center; font-size: 75%; }
.phone-note-ttl { display: inline-block; font-weight: bold; color: #fff; background-color: #337bae; padding: 0 0.3em; }
.phone-note-time { padding-left: 0.5em; }
.contact-btn,
.contact-phone { display: block; text-align: center; text-decoration: none; margin: 1em auto; }
.contact-btn:hover,
.contact-phone:hover { opacity: 1; background-color: #fdebf2; border-color: #e8424a; color: #212121; }
.contact-phone:hover .phone-note-ttl { background-color: #fff; color: #212121; }
.contact-btn { border: #cc1922 2px solid; padding: 0.5em 2em; font-weight: bold; color: #fff; background-color: #e8424a; }
@media screen and (max-width:767px){
	.contact-phone { background-color: #e2f0ff; padding: 0.5em 1em; }
}
@media screen and (min-width:768px){
	.phone-num { line-height: 1; }
	.phone-note-ttl { background-color: #e8424a; }
	.contact-phone { color: #212121; }
	.contact-phone:hover { background-color: transparent; cursor: default; }
	.contact-phone:hover .phone-note-ttl { background-color: #f2907a; color: #fff; }
}


/*
-------------------*/
.header { width: 100%; z-index: 991; }
.header-name { font-size: 1rem; padding: 12px 0 0 0; }
.nav-list-item { border-top: #cc1922 1px dotted; }
.nav-list-item:first-child { border-top: 0; }
.nav-list-item a {
	display: block; text-decoration: none; padding: 0.8em 1.5em 0.7em 0; color: #000;
	background-image: url(../img/); background-position: 100% 50%; background-repeat: no-repeat; background-size: 1em 1em;
}
@media screen and (max-width:767px){
	.header {height: 50px; position: relative; }
	.header-logo { width: 200px; }
	.menu-btn { position: absolute; width: 70px; height: 50px; top: 0px; right: 0px; cursor: pointer; }
	.hamburger-bar {
		position: absolute; top: 50%; left: 20px;
		display: block; height: 2px; background-color: #212121; width: 30px;
		-webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg);
		-webkit-transition: top 0.6s, transform 0.6s, opacity 0.4s; transition: top 0.6s, transform 0.6s, opacity 0.4s;
	}
	.hamburger-bar:nth-child(1) { margin-top: -10px; }
	.hamburger-bar:nth-child(2) { margin-top: 0; opacity: 1; }
	.hamburger-bar:nth-child(3) { margin-top: 10px; }
	.open > .hamburger-bar { background-color: #000; }
	.open > .hamburger-bar:nth-child(1) { transform: rotate(45deg); margin-top: 0; }
	.open > .hamburger-bar:nth-child(2) { opacity: 0; }
	.open > .hamburger-bar:nth-child(3) { transform: rotate(-45deg); margin-top: 0; }

	.header.open { position: fixed; top: 0; left: 0; background-color: #fff; }
	.menu-btn.open { background-color: #f6aeae; color: #000; }
	.drw-nav {
		background-color: #ffe5e5; position: absolute;
		transition: all 0.3s; top: 50px; left: 0; right: 0; width: 100%; height: 0;
		overflow: hidden; color: #000;
	}
	.drw-nav.open { height: calc(100vh - 50px); overflow: auto; }
	.drw-nav-list { padding-top: 1em; }
	.drw-contact .contact-phone,
	.drw-contact .contact-btn { border-color: #fff; color: #000; }
	.drw-contact .phone-note-ttl { background-color: #fff; color: #000; }
	.drw-contact .contact-phone:hover,
	.drw-contact .contact-btn:hover { background-color: #fff; color: #000; }
	.drw-contact .contact-phone:hover .phone-note-ttl { background-color: #fff; color: #000; }
	.header-nav,.header-contact { display: none; }
}
@media screen and (min-width:768px){
	.header {  }
	.header-name { float: left; width: 50%; max-width: 300px; padding-top: 20px; }
	.header-contact { float: right; margin: 2% 0 0 0 ; padding-top: 20px; }
	.header-phone { line-height: 1.2; text-align: right; font-size: 1.8rem; }
	.header-phone-note .phone-note-ttl { background-color: #f2907a; }
	.menu-btn,.drw-nav { display: none; }
	.inner,.drw-nav { display: none; }

	.header-nav { margin-top: 20px; background-color: #e65552; }
	.global-nav { display: table; table-layout: fixed; border-collapse: separate; width: 100%; }
	.global-nav-item { display: table-cell; position: relative; }
	.global-nav-anchor { display: block; color: #fff; text-decoration: none; text-align: center; padding-top: 20px; padding-bottom: 18px; position: relative; }
	.global-nav-item-ja { font-weight: bold; font-size: 1.8rem; }
	.global-nav-anchor:after {
		content: ""; display: block; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
		width: 0; height: 5px; background-color: #f6b2ae; transition: all 0.3s;
	}
	.global-nav-anchor:hover { opacity: 1; }
	.global-nav-anchor:hover:after,
/*	#home .global-nav-anchor.home:after,
	#casting .global-nav-anchor.casting:after,
	#works .global-nav-anchor.work:after,
	#company .global-nav-anchor.company:after, */
	#contact .global-nav-anchor.contact:after { width: 100%; }
	.global-sub { position: absolute; top: 100%; left: 0; height: 0; width: 100%; overflow: hidden; z-index: 3; }
	.global-sub-anchor { display: block; background-color: rgba(0,0,0,0.8); border: #212121 1px solid; padding: 0.3em 0; color: #fff; text-decoration: none; font-weight: bold; text-align: center; }
	.global-nav-item:hover .global-sub { height: auto; }
}


/*
-------------------*/
.bg01 {
	height: 150px; position: relative;
	background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;
}
.bg02 {
	height: 150px; position: relative;
	background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;
}
.bg03 {
	height: 150px; position: relative;
	background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;
}

.bg01.casting { background-image: url(../img/); }
.bg01.photographing { background-image: url(../); }
.bg01.works { background-image: url(../img/); }
.bg01.contact { background-image: url(../img/); }
.bg01-copy-wrapper {
	width: 100%; height: 100%; position: absolute; top: 0; left: 0;
	background-image: url(../img/); background-repeat: repeat; background-position: 0 0;
}
.bg02-copy-wrapper {
	width: 100%; height: 100%; position: absolute; top: 0; left: 0;
	background-image: url(../img/); background-repeat: repeat; background-position: 0 0;
}
.bg03-copy-wrapper {
	width: 100%; height: 100%; position: absolute; top: 0; left: 0;
	background-image: url(../img/); background-repeat: repeat; background-position: 0 0;
}
.bg01-copy-wrapper > .wrapper { position: relative; height: 100%; }
.bg02-copy-wrapper > .wrapper { position: relative; height: 100%; }
.bg03-copy-wrapper > .wrapper { position: relative; height: 100%; }
.bg01-copy {
	position: absolute; top: 50%; left: 4.5%; transform: translateY(-50%); width: 91%;
	text-align: center; line-height: 1.3; font-weight: bold; color: #fff;
}
.bg02-copy {
	position: absolute; top: 50%; left: 4.5%; transform: translateY(-50%); width: 91%;
	text-align: center; line-height: 1.3; font-weight: bold; color: #fff;
}
.bg03-copy {
	position: absolute; top: 50%; left: 4.5%; transform: translateY(-50%); width: 91%;
	text-align: center; line-height: 1.3; font-weight: bold; color: #fff;
}
@media screen and (min-width:768px){
	.bg01 { height: 300px; }
	.bg01-copy { font-size: 4.8rem; }
	.bg02 { height: 300px; }
	.bg02-copy { font-size: 4.8rem; }
	.bg03 { height: 300px; }
	.bg03-copy { font-size: 4.8rem; }

}
@media screen and (min-width:1100px){
	.bg01-copy { left: 0; width: 100%; }
	.bg02-copy { left: 0; width: 100%; }
	.bg03-copy { left: 0; width: 100%; }
}


/*
footer
-------------------*/
.footer { background-color: #f2f2f2; color: #000; padding-top: 2em; position: relative; }
.footer a { color: #000; text-decoration: none; }
.pagetop.wrapper { position: absolute; top: -50px; right: 0; width: 100%; padding: 0; }
.pagetop-anchor { display: block; width: 50px; height: 50px; box-sizing: border-box; margin-left: auto; background-color: #337bae; text-align: center; padding-top: 10px; }
.pagetop-ico { transform: rotate(-90deg); height: 30px; width: auto; }
.pagetop-anchor:hover { opacity: 1; padding-top: 8px; }

.footer-logo { width: 50%; max-width: 250px; margin-bottom: 2em; }
.footer-info { font-size: 1rem; }
.footer-info-line { margin: 1em auto; }
.footer .contact-btn { border-color: #cc1922; color: #fff; display: inline-block; }
.footer .contact-btn:hover { background-color: #ffeef2; color: #000; }
.copyright { border-top: #fff 1px dotted; padding-top: 1em; padding-bottom: 1em; margin-top: 2em; }

@media screen and (max-width:767px){
	.footer-l { display: none; }
	.footer-logo { width: 200px; }
	.footer-info {  }
	.copyright { font-size: 1rem; }
}
@media screen and (min-width:768px){
	.pagetop.wrapper { top: -100px; }
	.pagetop-anchor { width: 100px; height: 100px; padding-top: 20px; }
	.pagetop-ico { height: 60px; }
	.footer { padding-top: 4em; }
	.footer-l { float: left; width: 60%; }
	.footer-r { float: right; width: 35%; }
	.footer-nav-item { font-size: 1.4rem; }

	.footer-logo { width: 70%; }
	.footer-info { font-size: 1.4rem; }
	.copyright { font-size: 1.4rem; text-align: center; }
}
@media screen and (min-width:1100px){
	.pagetop.wrapper { width: 1100px; right: 50%; margin-right: -550px; }
	.footer-nav-item { display: inline-block; padding-right: 3em; }
}


/*
crumbs
-------------------*/
.crumbs { border-top: #ceb8a5 1px dotted; border-bottom: #ceb8a5 1px dotted; margin-top: 3rem; }
.crumbs-item { display: inline-block; margin-right: 0.8em; color: #6d3c30; font-size: 1.4rem; }
.crumbs-item a { text-decoration: none; color: #6d3c30; }
.crumbs-item:before { content: "\f105"; font-family: FontAwesome; display: inline-block; padding-right: 0.8em; color: #bcb7b6; }
.crumbs-item:first-child:before { content: ""; padding: 0; }
@media screen and (max-width:767px){
	.crumbs { display: none; }
}

/*
form
-------------------*/
.form-sub-ttl { display: inline-block; padding-right: 0.5rem; }
.form-sub-ttl.type2 { width: 2em; }
.form-sub-ttl.type4 { width: 4em; }
.form-req { background: #f00; color: #fff; display: inline-block; font-weight: bold; font-size: 85%; padding: 0.2em 0.5em; margin-left: 0.4em; margin-right: 0.4em; }
.form-sep { padding-left: 0.6em; padding-right: 0.6em;}
.form-input { border: #d8d8d8 1px solid; background: #f8f8f8; box-sizing: border-box; padding: 0.4em; }
.form-input:focus { background: #fefefe; }
.text-s { width: 4em; }
.text-m { width: 80%; }
.text-l { width: 100%; }
.form-sub-ttl.type2 + .text-m { width: calc(80% - 2em - 1rem); }
.form-sub-ttl.type2 + .text-l { width: calc(100% - 2em - 1rem); }
.form-sub-ttl.type4 + .text-m { width: calc(80% - 4em - 1rem); }
.form-sub-ttl.type4 + .text-l { width: calc(100% - 4em - 1rem); }
.form-submit-block { margin-top: 3em; text-align: center; }
.form-btn {
	display: inline-block; position: relative; padding: 0.8em 3em;
	background-color: transparent; color: #377bae; font-weight: bold; border: #377bae 1px solid;
	text-align: center; text-decoration: none;
}
.form-btn:hover { opacity: 1; background-color: #fbf30d; border-color: #fbf30d; color: #212121; }
@media screen and (max-width:767px){
	.text-s { width: 4em; }
	.text-m { width: 100%; }
	.form-sub-ttl.type2 + .text-m { width: calc(100% - 2em - 1rem); }
	.form-sub-ttl.type4 + .text-m { width: calc(100% - 4em - 1rem); }
	.form-submit-block .form-btn { display: block; width: 100%; }
}
@media screen and (min-width:768px){
	.form-btn { font-size: 1.8rem; }
}


/*
inview
-------------------*/
.inview {
	opacity: 0;
	-moz-transform: translateY(50px);
	-webkit-transform: translateY(50px);
	-o-transform: translateY(50px);
	-ms-transform: translateY(50px);
	transform: translateY(50px);
	  -webkit-transition: all .8s;
     -moz-transition: all .8s;
      -ms-transition: all .8s;
          transition: all .8s;
}
.inview.inview-start {
	opacity: 1;
	-moz-transform: translateY(0);
	-webkit-transform: translateY(0);
	-o-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
}
.Form {
  margin-top: 80px;
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
}
@media screen and (max-width: 480px) {
  .Form {
    margin-top: 40px;
  }
}
.Form-Item {
  border-top: 1px solid #ddd;
  padding-top: 24px;
  padding-bottom: 24px;
  width: 100%;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 480px) {
  .Form-Item {
    padding-left: 14px;
    padding-right: 14px;
    padding-top: 16px;
    padding-bottom: 16px;
    flex-wrap: wrap;
  }
}
.Form-Item:nth-child(5) {
  border-bottom: 1px solid #ddd;
}
.Form-Item-Label {
  width: 100%;
  max-width: 248px;
  letter-spacing: 0.05em;
  font-weight: bold;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label {
    max-width: inherit;
    display: flex;
    align-items: center;
    font-size: 15px;
  }
}
.Form-Item-Label.isMsg {
  margin-top: 8px;
  margin-bottom: auto;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label.isMsg {
    margin-top: 0;
  }
}
.Form-Item-Label-Required {
  border-radius: 6px;
  margin-right: 8px;
  padding-top: 8px;
  padding-bottom: 8px;
  width: 48px;
  display: inline-block;
  text-align: center;
  background: #5bc8ac;
  color: #fff;
  font-size: 14px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Label-Required {
    border-radius: 4px;
    padding-top: 4px;
    padding-bottom: 4px;
    width: 32px;
    font-size: 10px;
  }
}
.Form-Item-Input {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 48px;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Input {
    margin-left: 0;
    margin-top: 18px;
    height: 40px;
    flex: inherit;
    font-size: 15px;
  }
}
.Form-Item-Textarea {
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-left: 40px;
  padding-left: 1em;
  padding-right: 1em;
  height: 216px;
  flex: 1;
  width: 100%;
  max-width: 410px;
  background: #eaedf2;
  font-size: 18px;
}
@media screen and (max-width: 480px) {
  .Form-Item-Textarea {
    margin-top: 18px;
    margin-left: 0;
    height: 200px;
    flex: inherit;
    font-size: 15px;
  }
}
.Form-Btn {
  border-radius: 6px;
  margin-top: 32px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 20px;
  padding-bottom: 20px;
  width: 280px;
  display: block;
  letter-spacing: 0.05em;
  background: #5bc8ac;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
}
@media screen and (max-width: 480px) {
  .Form-Btn {
    margin-top: 24px;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 160px;
    font-size: 16px;
  }
}


@media screen and (max-width: 640px) {
    #top-head,
    .inner {
        width: 100%;
        padding: 0;
    }
    #top-head {
        top: 0;
        position: fixed;
        margin-top: 0;
    }
    /* Fixed reset */
    #top-head.fixed {
        padding-top: 0;
        background: transparent;
    }
    #mobile-head {
        background: #fff;
        width: 100%;
        height: 56px;
        z-index: 999;
        position: relative;
    }
    #top-head.fixed .logo,
    #top-head .logo {
        position: absolute;
        left: 13px;
        top: 13px;
        color: #333;
        font-size: 26px;
    }
    #global-nav {
        position: absolute;
        /* 開いてないときは画面外に配置 */
        top: -500px;
        background: #fff;
        width: 100%;
        text-align: center;
        padding: 10px 0;
        -webkit-transition: .5s ease-in-out;
        -moz-transition: .5s ease-in-out;
        transition: .5s ease-in-out;
    }
    #global-nav ul {
        list-style: none;
        position: static;
        right: 0;
        bottom: 0;
        font-size: 14px;
    }
    #global-nav ul li {
        float: none;
        position: static;
    }
    #top-head #global-nav ul li a,
    #top-head.fixed #global-nav ul li a {
        width: 100%;
        display: block;
        color: #fff;
        padding: 18px 0;
    }
    #nav-toggle {
        display: block;
    }
    /* #nav-toggle 切り替えアニメーション */
    .open #nav-toggle span:nth-child(1) {
        top: 11px;
        -webkit-transform: rotate(315deg);
        -moz-transform: rotate(315deg);
        transform: rotate(315deg);
    }
    .open #nav-toggle span:nth-child(2) {
        width: 0;
        left: 50%;
    }
    .open #nav-toggle span:nth-child(3) {
        top: 11px;
        -webkit-transform: rotate(-315deg);
        -moz-transform: rotate(-315deg);
        transform: rotate(-315deg);
    }
    /* #global-nav スライドアニメーション */
    .open #global-nav {
        /* #global-nav top + #mobile-head height */
        -moz-transform: translateY(556px);
        -webkit-transform: translateY(556px);
        transform: translateY(556px);
    }
}






      .parent {
        background: #fff;
        display: flex;
        text-align: center;
        margin: 0px;
        padding: 0px;
      }

      .child {
        background: #fff;
        width: 100%;
        font-size: 2rem;
        text-align: center;
        margin: 0px 5px 20px 0px;
        padding: 0px;
      }

      @media screen and (max-width: 800px) {
        .parent {
          flex-wrap: wrap;
        }
      }

      @media screen and (max-width: 390px) {
        .parent {
          display: block;
        }
      }




.btn,
a.btn,
button.btn {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 2;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.btn-wrap-pc-sp {
  max-width: 435px;
  margin: 0 auto 5px;
}

a.btn-pc-sp {
  line-height: 1.4;

  width: 49.5%;
  padding: 1.25rem 0;

  color: #ffff;
}

a.btn--contact {
  display: block;

  padding: 2.6rem 0;

  color: #fff;
  background: #d20010;
  -webkit-box-shadow: 0 5px 0 #b9000e;
  box-shadow: 0 5px 0 #b9000e;
}

a.btn--contact i {
  font-size: 2rem;
}

a.btn--contact i.fa-position-left {
  font-size: 3rem;

  left: 2rem;
}

a.btn--contact :hover {
  color: #fff;
}

a.btn--tel {
  display: block;


  padding: 1rem 0;

  color: #fff;
  background: #094;
  -webkit-box-shadow: 0 5px 0 #008039;
  box-shadow: 0 5px 0 #008039;
}

a.btn--tel i {
  font-size: 2rem;
}

a.btn--tel i.fa-position-left {
  font-size: 3rem;

  left: 2rem;
}

a.btn--tel .number {
  line-height: 1;

  display: inline-block;

  margin-top: 0.5rem;
  padding: 0.25rem 2rem;

  letter-spacing: 0;

  color: #094;
  border-radius: 0.5rem;
  background: #fff;
}

a.btn--tel:hover {
  color: #000;
}

.fa-position-left {
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1rem;
}

.fa-position-right {
  position: absolute;
  top: calc(50% - 0.5em);
  right: 1rem;
}