@charset "utf-8";

/*-------------------------------
Top
-------------------------------*/

#Top #MV {width: 100%; height: 760px; padding-top: 80px;  background: url("../img/mv.jpg") no-repeat center bottom; background-size: auto 760px;}
#Top #MV .textArea{margin: 120px 0 0 10%; position: absolute;}
#Top #MV .copy{font-size: 36px; line-height: 68px;}
#Top #MV .job{font-size: 14px; line-height: 24px; margin-top: 48px; }
#Top #MV .name{font-size: 24px; margin-top: 16px;}
#Top #MV .img-text {margin: 160px 0 0 6%; width: 94%; height: 760px; background: url("../img/SotaroJinno.svg") no-repeat; background-size: 635px 425px; position: absolute;}
#Top #MV .scroll{margin: 120px 0 0 160px;}

#Top #Movie{background-color: #F5F5F5; text-align: center; padding: 160px 0;}

#Top #Profile {padding: 160px 0; background: url("../img/triangle.png") no-repeat center 0; background-size: 1920px;}
#Top #Profile .ProfileInn {width: 960px; margin: 0 auto;}
#Top #Profile .img {width: 400px; float: left;}
#Top #Profile .textArea{width: 460px; margin-left: 500px}
#Top #Profile .job{font-size: 16px; line-height: 28px; }
#Top #Profile .name{font-size: 36px; line-height: 1em; margin-top: 24px; }
#Top #Profile .ruby{font-size: 14px; line-height: 1em; margin-top: 16px; }
#Top #Profile .copy{font-size: 18px; line-height: 36px; margin-top: 40px; width: 460px; margin-left: 500px}
#Top #Profile .detail a{font-size: 16px; line-height: 60px; height: 60px; padding-right: 84px; margin-top: 60px; background: url("../img/arrow.png") no-repeat right center; background-size: 60px; text-decoration: none; display: inline-block; margin-left: 500px}
#Top #Profile .detail span {border-bottom:solid #111 2px; padding: 8px 0;}
#Top #Profile .detail a:hover {color: #FF3D00; transition: all 0.4s;}

#Top #Logo{background-color: #F5F5F5; padding: 160px 0;}
#Top #Logo .LogoInn {display: flex; flex-flow: row-reverse; width: 960px; margin: 0 auto;}
#Top #Logo .img{background: #FFFFFF; width: 400px; height: 400px;}
#Top #Logo .textArea{margin: 0 100px 0 0; width: 460px}
#Top #Logo .copy{font-size: 16px; line-height: 32px;}
#Top #Logo .copy p{margin-top: 1em;}


@media screen and (max-width : 999px ){	
	#Top #MV {height: 490px; padding-top: 60px;  background: url("../img/mv.jpg") no-repeat 57% bottom; background-size: auto 340px;}
	#Top #MV .textArea{margin: 40px 0 0 5%;}
	#Top #MV .copy{font-size: 24px; line-height: 40px;}
	#Top #MV .job{font-size: 12px; line-height: 20px; margin-top: 60px;}
	#Top #MV .name{margin-top: 20px;}
	#Top #MV .img-text {margin: 236px 0 0 2.5%; width: 97.5%; height: 160px; background: url("../img/SotaroJinno.png") no-repeat; background-size: auto 160px;}
	#Top #MV .scroll{margin: 60px 0 0 20%;}

	#Top #Movie{padding: 48px 0;}
	#Top #Movie .MovieInn{position:relative; width: 90%; height: 0; padding-top: 50.625%; background-color: black; margin: 0 auto;}
	#Top #Movie iframe{position:absolute; top:0; left:0; width:100%; height:100%;}

	#Top #Profile {padding: 48px 0; background: url("../img/triangle.png") no-repeat left 0; background-size: auto 140px;}
	#Top #Profile .ProfileInn {width: 90%; margin: 0 auto;}
	#Top #Profile .img, #Top #Profile .img img {width: 140px; height: 140px;}
	#Top #Profile .textArea{width: auto; margin-left: 172px;}
	#Top #Profile .job{font-size: 14px; line-height: 22px;}
	#Top #Profile .name{font-size: 28px; margin-top: 12px;}
	#Top #Profile .ruby{font-size: 12px; margin-top: 8px;}
	#Top #Profile .copy{font-size: 16px; line-height: 32px;width: 100%; margin:32px 0 0}
	#Top #Profile .detail a{font-size: 14px; line-height: 48px; height: 48px; padding-right: 68px; margin: 32px 0 0; background-size: 48px; position: relative; left: 50%; transform: translateX(-50%);}

	#Top #Logo{padding: 48px 0;}
	#Top #Logo .LogoInn {flex-flow:column; width: 90%; margin: 0 auto;}
	#Top #Logo .img{position: relative; width:100%; height: 0; padding:100% 0 0}
	#Top #Logo img{position: absolute; left:0; top: 0; width:100%; height: 100%;}
	#Top #Logo .textArea{margin: 32px 0 0; width: 100%}
	#Top #Logo .copy{font-size: 15px; line-height: 30px;}

}


/*-------------------------------
Profile
-------------------------------*/
#Prof #MV {width: 100%; height: 460px;  background: url("../img/Profile-bg.png") no-repeat center bottom; background-size: auto 520px; display: flex; align-items: center;}
#Prof #MV .MVInn {width: 960px; margin: -60px auto 0;}
/*#Prof #MV .MVInn .img{float: right}
#Prof #MV .MVInn .img-text {margin: 40px 0 0 80px; width: 445px; height: 760px; background: url("../img/Profile-text.png") no-repeat; background-size: 445px 127px; position: absolute;}*/
#Prof #MV .MVInn p{text-align: center; color: #FFF; line-height: 1.8em; font-size: 20px;}


#Prof #Profile-1 {width:800px; margin: -120px auto 80px;}
#Prof #Profile-1 #ProflieInner {display: flex; justify-content: space-between; align-items: center;}
#Prof #Profile-1 #ProflieInner .textArea {margin-top: 20px;}

#Prof #Profile-1 .ttl{font-size: 12px; padding-bottom: 4px; color: #FF3D00; margin-bottom: 24px; border-bottom: 2px solid #FF3D00; display: inline-block;}
#Prof #Profile-1 .job{font-size: 16px; line-height: 28px; }
#Prof #Profile-1 .name{font-size: 36px; line-height: 1em; margin-top: 24px; }
#Prof #Profile-1 .ruby{font-size: 14px; line-height: 1em; margin-top: 16px; }
#Prof #Profile-1 .copy{font-size: 16px; line-height: 32px; margin-top: 60px;}
#Prof #Profile-1 .copy p:not(:first-child){margin-top: 40px;}

#Prof #Profile-2 {background-color: #F5F5F5; padding: 80px 0;}
#Prof #Profile-2 .Profile-2Inn {display: flex; justify-content: space-between; width: 800px; margin: 0 auto}
#Prof #Profile-2 .copy{font-size: 15px; line-height: 30px; width: 460px;}
#Prof #Profile-2 .copy p:not(:first-child){margin-top: 40px;}
#Prof #Profile-2 li{text-indent: -1em; padding-left: 1em;}

@media screen and (max-width : 999px ){	
	#Prof #MV {width: 100%; height: 500px; background: url("../img/Profile-bg-sp.png") no-repeat center bottom;  background-size: auto 500px; align-items: flex-start;}
	#Prof #MV .MVInn {width: 100%; margin: 100px auto 0;}
	/*#Prof #MV .MVInn .img{float: none; width:100%; position: absolute; top:70px; z-index: 2;}*/
	/*#Prof #MV .MVInn .img{width:100%;}
	#Prof #MV .MVInn .img img{width:100%; height:auto}
	#Prof #MV .MVInn .img-text {margin: 0; width: 100%; height: 0; padding-top: 28.54%; background: url("../img/Profile-text.png") no-repeat; background-size: 100%; position: absolute; z-index: 1} */
	#Prof #MV .MVInn p{font-size: 17px;}

	#Prof #Profile-1 {width:90%; margin: -180px auto 48px;}
	#Prof #Profile-1 .job{font-size: 14px; line-height: 22px;}
	#Prof #Profile-1 #ProflieInner {flex-direction: column-reverse;}
	#Prof #Profile-1 #ProflieInner .textArea {width: 100%; margin-top: 40px;}
	#Prof #Profile-1 #ProflieInner .img{width:240px;}
	#Prof #Profile-1 #ProflieInner .img img{width:100%; height:auto}
	
	#Prof #Profile-1 .name{font-size: 28px; margin-top: 12px;}
	#Prof #Profile-1 .ruby{font-size: 12px; margin-top: 8px;}
	#Prof #Profile-1 .copy{font-size: 15px; line-height: 30px; margin-top: 40px;}
	#Prof #Profile-1 .copy p:not(:first-child){margin-top: 24px;}

	#Prof #Profile-2 {background-color: #F5F5F5; padding: 48px 0;}
	#Prof #Profile-2 .Profile-2Inn {display: flex; flex-start: space-between; flex-flow:column; width: 90%; margin: 0 auto}
	#Prof #Profile-2 .copy{font-size: 14px; line-height: 28px; width: 100%; margin-top: 32px}
	#Prof #Profile-2 .copy p:not(:first-child){margin-top: 24px;}
}


/*-------------------------------
Service
-------------------------------*/
#Service #MV {width: 100%; height: 480px; padding-top: 80px; background: url("../img/SP-service-KV.jpg") no-repeat calc(50% + 330px) 80px #F5F5F5; background-size: auto 480px;}
#Service #MV p {font-size: 26px; line-height: 2.4em;}
#Service #MV .orange {color: #FF3D00;}
#Service #MV .inner {width: 900px; margin: 0 auto; top:50%; transform: translateY(-50%); position:relative;}

#Service #Check {}
#Service #Check h2 {text-align: center; font-size: 36px; margin-top: 100px; line-height: 1em;}
#Service #Check ul {margin: 60px auto 0; width: 800px; font-size: 20px; line-height: 1.8em}
#Service #Check li {padding: 24px 0 24px 48px; border-bottom: solid 1px #000; background: url("../img/check.svg") no-repeat 0 calc(50% - 1px); background-size: 30px auto}
#Service #Check .answer {background: url("../img/arrow.svg") no-repeat center top #F5F5F5; padding: 120px 0; margin-top: 100px}
#Service #Check .answer h3 {text-align: center; font-size: 26px; line-height: 2.4em}

#Service #consult {margin: 100px 0 160px;}
#Service #consult h2 , #Service #About h2 , #Service #Flow h2 {text-align: center; font-size: 40px; line-height: 1em;}
#Service #consult h2:after , #Service #About h2:after , #Service #Flow h2:after {content: ''; display: block; position: absolute; height: 2px; width: 48px; background-color: #FF3D00; left: 50%; margin-top: 32px; transform: translateX(-50%); }
#Service #consult ul {width: 976px; height: 496px; margin: 100px auto 0; display: flex; justify-content: space-between; flex-wrap: wrap;}
#Service #consult li {font-size: 24px; line-height: 1.8em; text-align: center; width: 320px; height: 240px; background: url("../img/arrow2.svg") no-repeat 6px 6px #f5f5f5; display: table}
#Service #consult li p {display: table-cell; vertical-align: middle;}

#Service #About {text-align: center; padding-bottom: 160px;}
#Service #About img{padding: 80px 0 40px}
#Service #About p{font-size: 16px; line-height: 1em}

#Service #Flow h2 {padding: 0 0 160px;}
#Service #Flow .content {background-color: #F5F5F5; padding: 0 0 50px;}
#Service #Flow .FlowInn {width: 960px; position: relative; text-align: center; top: -50px; left: 50%; transform: translateX(-50%);}
#Service #Flow .FlowInn .base {display: flex; width: 100%;}
#Service #Flow .FlowInn .arrow:after {content: ''; display: block; position: absolute; height: 60px; width: 960px; background: url("../img/arrow-pc.png") no-repeat center 22px; background-size: auto 16px;}
#Service #Flow .FlowInn .sec {margin-bottom: -10px;}
#Service #Flow .FlowInn .sec01 {background-color: #FF3D00; width: 480px; color: #FFF; height: 100px; line-height: 100px; font-size: 20px; border-radius: 5px 0 0 5px;}
#Service #Flow .FlowInn .sec02 {background-color: #646464; width: 480px; color: #FFF; height: 100px; line-height: 100px; font-size: 20px; border-radius: 0 5px 5px 0;}
#Service #Flow .FlowInn .frame {background-color: #FFF; line-height: 32px; font-size: 18px; border-radius: 5px; box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.08); min-height: 100px; align-items: center; margin-top: 60px; position: relative;}
#Service #Flow .FlowInn .frame p {min-width: 440px; padding: 0 20px;}
#Service #Flow .FlowInn .frame p:nth-child(2):before {content: ''; display: block; position: absolute; width: 1px; height: 70%; left: 50%; top:15%; background-color: #DCDCDC; }
#Service #Flow .FlowInn .frame .p2 {width: 960px;}

#Service .detail a{font-size: 24px; line-height: 60px; height: 60px; padding-right: 84px; background: url("../img/arrow.png") no-repeat right center; background-size: 60px; text-decoration: none; display: inline-block; position: relative; left: 50%; transform: translateX(-50%);}
#Service .detail span {border-bottom:solid #111 2px; padding: 8px 0;}
#Service .detail a:hover {color: #FF3D00; transition: all 0.4s;}
#Service #BannerArea {padding: 100px 0;}

@media screen and (max-width : 999px ){	
	#Service #MV {height: 440px; padding-top: 60px; background: url("../img/SP-service-KV.jpg") no-repeat calc(100% + 35px) bottom #F5F5F5; background-size: auto 328px;}
	#Service #MV p {font-size: 19px; line-height: 2em;}
	#Service #MV .inner {width: 335px; margin: 30px auto 0 5%; transform: translateY(0%); position:static;}
	
	#Service #Check h2 {font-size: 24px; margin-top: 50px;}
	#Service #Check ul {margin: 16px auto 0; width: 90%; font-size: 16px; line-height: 1.6em}
	#Service #Check li {padding: 16px 0 16px 32px; background: url("../img/check.svg") no-repeat 0 calc(50% - 1px); background-size: 24px auto}
	#Service #Check .answer {background: url("../img/arrow.svg") no-repeat center top #F5F5F5; padding: 50px 0 40px; margin-top: 50px; background-size: 80px auto}
	#Service #Check .answer h3 {font-size: 20px; line-height: 2em; width: 90%; margin: 0 auto;}
	
	#Service #consult {margin: 50px 0 80px;}
	#Service #consult h2 , #Service #About h2 , #Service #Flow h2 {font-size: 28px;}
	#Service #consult h2:after , #Service #About h2:after , #Service #Flow h2:after {width: 40px; margin-top: 20px;}
	#Service #consult ul {width: 90%; margin-top: 50px; height: auto;}
	#Service #consult li {font-size: 20px; line-height: 1.6em; width: 100%; height: 132px; background-size: 40px; margin-top: 10px;}

	#Service #About {padding-bottom: 80px;}
	#Service #About img{padding: 40px 0 16px; width: 325px; height: auto;}
	#Service #About p{font-size: 14px; line-height: 26px;}

	#Service #Flow h2 {padding: 0 0 100px;}
	#Service #Flow .content {padding: 0 0 10px;}
	#Service #Flow .FlowInn {width: 90%; top: -40px;}
	#Service #Flow .FlowInn .base {}
	#Service #Flow .FlowInn .arrow:after {height: 46px; width: 100%; background: url("../img/arrow-sp.png") no-repeat center 16px; background-size: auto 14px;}
	#Service #Flow .FlowInn .sec01 {width: 50%; height: 80px; line-height: 80px; font-size: 18px;}
	#Service #Flow .FlowInn .sec02 {width: 50%; height: 80px; line-height: 80px; font-size: 18px;}
	#Service #Flow .FlowInn .frame {line-height: 24px; font-size: 14px; min-height: 100px; align-items: center; margin-top: 46px;}
	#Service #Flow .FlowInn .frame p {min-width: 42%; padding: 4%;}
	#Service #Flow .FlowInn .frame .p2 {width: 100%;}
	
	#Service .detail a{font-size: 16px; line-height: 48px; height: 48px; padding-right: 68px; background-size: 48px;}
	#Service #BannerArea {padding: 50px 0;}
}


/*-------------------------------
Mission
-------------------------------*/
#Mission #MV {width: 100%; height: 240px; padding-top: 80px; background-color: #FF3D00; text-align: center}
#Mission #MV h2 {color: #FFF; font-size: 36px; line-height: 1em; margin:88px 0 0;}
#Mission #MV h2:after {content: ''; display: block; position: absolute; height: 2px; width: 48px; background-color: #FFF; left: 50%; top:228px;  transform: translateX(-50%); }

#Mission #QA {background-color: #F5F5F5; padding: 100px 0;}
#Mission .sec {width: 860px; margin: 0 auto; border-radius: 5px; box-shadow: 20px 20px 40px rgba(0, 0, 0, 0.08); padding: 60px 60px 60px 40px; background-color: #FFF}
#Mission .sec:not(:last-child) {margin-bottom: 80px}

#Mission .sec  img {float: right; margin: 0 0 0 28px}
#Mission .sec .q {font-size: 20px; margin: 0 0 0 84px}
#Mission .sec .q:before {content: ''; display: block; position: absolute; margin:-20px 0 0 -84px; height: 60px; width: 60px; background: url("../img/Q.png") no-repeat 0 0; background-size: 60px;}
#Mission .sec .a {line-height: 32px; margin: 40px 0 0 84px}
#Mission .sec .a p:not(:last-child){margin-bottom: 1.5em}
#Mission .sec .a:before {content: ''; display: block; position: absolute; margin:0 0 0 -84px; height: 60px; width: 60px; background: url("../img/A.png") no-repeat 0 0; background-size: 60px;}

@media screen and (max-width : 999px ){	
	#Mission #MV {height: 160px; padding-top: 60px; }
	#Mission #MV h2 {margin:48px 0 0;}
	#Mission #MV h2:after {top:168px;}
	
	#Mission #QA {padding: 48px 0;}
	#Mission .sec {width: 80%; padding: 6% 5% 5% 5%;}
	#Mission .sec:not(:last-child) {margin-bottom: 48px}

	#Mission .sec  img {float:none; margin: 0 0 20px; width: 100%; height: auto;}
	#Mission .sec .q {font-size: 18px; line-height: 28px;  margin: 0 0 0 52px; min-height: 40px;}
	#Mission .sec .q:before {margin:0px 0 0 -52px; height: 40px; width: 40px; background-size: 40px;}
	#Mission .sec .a {font-size: 15px; line-height: 30px; margin: 20px 0 0 0}
	#Mission .sec .a:before {display: none;}
}

/*-------------------------------
Voice
-------------------------------*/
#Voice #MV {width: 100%; height: 240px; padding-top: 80px; background-color: #FF3D00; text-align: center}
#Voice #MV h2 {color: #FFF; font-size: 36px; line-height: 1em; margin:88px 0 0;}
#Voice #MV h2:after {content: ''; display: block; position: absolute; height: 2px; width: 48px; background-color: #FFF; left: 50%; top:228px;  transform: translateX(-50%); }

#Voice #Inner {background-color: #F5F5F5; padding: 100px 0;}
#Voice .sec {width: 840px; margin: 0 auto; border-radius: 5px; box-shadow: 20px 20px 40px rgba(0, 0, 0, 0.08); padding:48px 60px 60px 60px; background-color: #FFF}
#Voice .sec:not(:last-child) {margin-bottom: 80px}

#Voice .sec  img {float: right; margin: 0 0 0 28px}
#Voice .sec .client {font-size: 20px;}
#Voice .sec .job {font-size: 15px; margin-bottom: 16px}
#Voice .sec .voice {line-height: 32px; margin: 24px 0 0 0; padding: 48px 0 0 0; border-top: solid 1px #DCDCDC;}
#Voice .sec .voice p:not(:last-child){margin-bottom: 1.5em}

@media screen and (max-width : 999px ){	
	#Voice #MV {height: 160px; padding-top: 60px; }
	#Voice #MV h2 {margin:48px 0 0;}
	#Voice #MV h2:after {top:168px;}
	
	#Voice #Inner {padding: 48px 0;}
	#Voice .sec {width: 80%; padding: 5%;}
	#Voice .sec:not(:last-child) {margin-bottom: 48px}

	#Voice .sec  img {float:none; margin: 0 0 20px; width: 100%; height: auto;}
	#Voice .sec .client {font-size: 18px;}
	#Voice .sec .job {font-size: 13px; margin-bottom: 8px; line-height: 1.6em}
	#Voice .sec .voice {font-size: 15px; line-height: 30px; margin: 20px 0 0 0; padding: 28px 0 0 0; }
}


/*-------------------------------
Contact
-------------------------------*/
#Contact #MV {width: 100%; height: 240px; padding-top: 80px; background-color: #FF3D00; text-align: center}
#Contact #MV h2 {color: #FFF; font-size: 36px; line-height: 1em; margin:88px 0 0;}
#Contact #MV h2:after {content: ''; display: block; position: absolute; height: 2px; width: 48px; background-color: #FFF; left: 50%; top:228px;  transform: translateX(-50%); }

#Contact #Form {width:960px; margin: 0 auto; padding: 100px 0;}
#Contact #Form h3{font-size: 20px; text-align: center;}
#Contact #Form .text{line-height: 28px; text-align: center; width: 100%; border-top: solid 1px #DCDCDC;  border-bottom: solid 1px #DCDCDC; padding: 24px 0; margin: 80px 0 100px;} 

#Contact #Form .set{font-size: 18px;line-height: 28px; width: 100%; margin-top: 40px; display: flex; justify-content: space-between;}
#Contact #Form .form2{width: 220px;  height: 60px; align-items: center; display: flex;}
#Contact #Form .form3{width: 740px;}
#Contact #Form .form3 input{width: 720px; height: 40px; padding: 10px; border-radius: 5px; border: solid 1px #DCDCDC; font-size: 16px;}
#Contact #Form .form3 .att{font-size: 16px; margin-top: 12px}
#Contact #Form .form3 textarea{width: 720px; padding: 10px; border-radius: 5px; border: solid 1px #DCDCDC; font-size: 16px; line-height: 28px;}
#Contact #Form .form4 {width: 220px; }

#Contact #Form .detail a{font-size: 16px; line-height: 60px; height: 60px; padding-right: 84px; margin-top: 60px; background: url("../img/arrow.png") no-repeat right center; background-size: 60px; text-decoration: none; display: inline-block; position: relative; left: 50%; transform: translateX(-50%);}
#Contact #Form .detail span {border-bottom:solid #111 2px; padding: 8px 0;}
#Contact #Form .detail a:hover {color: #FF3D00; transition: all 0.4s;}

#Contact #Form .set2{font-size: 16px;line-height: 32px; width: 100%; margin-top: 24px; display: flex; justify-content: space-between; border-bottom: dotted 1px #ccc; padding-bottom: 24px;}
#Contact #Form .form5{width: 220px;}
#Contact #Form .form6{width: 740px;}

#Contact #Form .back {text-align: left; font-size: 16px; margin: 48px 0 0;}
#Contact #Form .back a {text-decoration: none}

@media screen and (max-width : 999px ){	
	#Contact #MV {height: 160px; padding-top: 60px; }
	#Contact #MV h2 {margin:48px 0 0;}
	#Contact #MV h2:after {top:168px;}
	
	#Contact #Form {width:86%; margin: 0 auto; padding: 48px 0 48px }
	#Contact #Form h3{font-size: 18px; line-height: 28px}
	#Contact #Form .text{font-size: 15px; line-height: 30px; text-align: left; width: 100%; padding: 24px 0 20px; margin: 40px 0 48px;} 

	#Contact #Form .set{font-size: 16px;line-height: 1em; width: 100%; margin-top: 24px; flex-flow: column; justify-content:flex-start;}
	#Contact #Form .form2{width: 100%;  height: auto; display:inline; margin-bottom: 12px}
	#Contact #Form .form3{width: 100%;}
	#Contact #Form .form3 input{width: 90%; padding: 10px 5%;}
	#Contact #Form .form3 .att{font-size: 14px; margin-top: 8px; line-height: 22px}
	#Contact #Form .form3 textarea{width: 90%; padding: 10px 5%;}
	#Contact #Form .form4 {width: 100%;  margin-bottom: 12px}
	
	#Contact #Form .detail a{font-size: 16px; line-height: 48px; height: 48px; padding-right: 68px; margin: 40px 0 0; background-size: 48px;}
	
	#Contact #Form .set2{font-size: 14px;line-height: 28px; width: 100%; margin-top: 20px; flex-flow: column; justify-content: flex-start; border-bottom: dotted 1px #ccc; padding-bottom: 20px;}
	#Contact #Form .form5{width: 100%; margin-bottom: 12px}
	#Contact #Form .form6{width: 100%;}

	#Contact #Form .back {font-size: 13px; margin: 40px 0 0;}
}

/*-------------------------------
Mission
-------------------------------*/
#Mission #MV {width: 100%; height: 240px; padding-top: 80px; background-color: #FF3D00; text-align: center}
#Mission #MV h2 {color: #FFF; font-size: 36px; line-height: 1em; margin:88px 0 0;}
#Mission #MV h2:after {content: ''; display: block; position: absolute; height: 2px; width: 48px; background-color: #FFF; left: 50%; top:228px;  transform: translateX(-50%); }

#Mission #QA {background-color: #F5F5F5; padding: 100px 0;}
#Mission .sec {width: 860px; margin: 0 auto; border-radius: 5px; box-shadow: 20px 20px 40px rgba(0, 0, 0, 0.08); padding: 60px 60px 60px 40px; background-color: #FFF}
#Mission .sec:not(:last-child) {margin-bottom: 80px}

#Mission .sec  img {float: right; margin: 0 0 0 28px}
#Mission .sec .q {font-size: 20px; margin: 0 0 0 84px}
#Mission .sec .q:before {content: ''; display: block; position: absolute; margin:-20px 0 0 -84px; height: 60px; width: 60px; background: url("../img/Q.png") no-repeat 0 0; background-size: 60px;}
#Mission .sec .a {line-height: 32px; margin: 40px 0 0 84px}
#Mission .sec .a p:not(:last-child){margin-bottom: 1.5em}
#Mission .sec .a:before {content: ''; display: block; position: absolute; margin:0 0 0 -84px; height: 60px; width: 60px; background: url("../img/A.png") no-repeat 0 0; background-size: 60px;}

@media screen and (max-width : 999px ){	
	#Mission #MV {height: 160px; padding-top: 60px; }
	#Mission #MV h2 {margin:48px 0 0;}
	#Mission #MV h2:after {top:168px;}
	
	#Mission #QA {padding: 48px 0;}
	#Mission .sec {width: 80%; padding: 6% 5% 5% 5%;}
	#Mission .sec:not(:last-child) {margin-bottom: 48px}

	#Mission .sec  img {float:none; margin: 0 0 20px; width: 100%; height: auto;}
	#Mission .sec .q {font-size: 18px; line-height: 28px;  margin: 0 0 0 52px; min-height: 40px;}
	#Mission .sec .q:before {margin:0px 0 0 -52px; height: 40px; width: 40px; background-size: 40px;}
	#Mission .sec .a {font-size: 15px; line-height: 30px; margin: 20px 0 0 0}
	#Mission .sec .a:before {display: none;}
}


/*-------------------------------
Hospital
-------------------------------*/
#Hospital #MV {width: 100%; height: 240px; padding-top: 80px; background-color: #FF3D00; text-align: center}
#Hospital #MV h2 {color: #FFF; font-size: 36px; line-height: 1em; margin:88px 0 0;}
#Hospital #MV h2:after {content: ''; display: block; position: absolute; height: 2px; width: 48px; background-color: #FFF; left: 50%; top:228px;  transform: translateX(-50%); }

#Hospital #Flow .copy {padding: 80px 0 130px; text-align: center; font-size: 20px; line-height: 2em}
#Hospital #Flow .content {background-color: #F5F5F5; padding: 0 0 50px;}
#Hospital #Flow .FlowInn {width: 960px; position: relative; text-align: center; top: -50px; left: 50%; transform: translateX(-50%);}
#Hospital #Flow .FlowInn .base {display: flex; width: 100%; justify-content: space-between;}
#Hospital #Flow .FlowInn .arrow-1:after {content: ''; display: block; position: absolute; height: 60px; width: 960px; background: url("../img/arrow-pc2-1.png") no-repeat center 22px; background-size: auto 16px;}
#Hospital #Flow .FlowInn .arrow-2:after {content: ''; display: block; position: absolute; height: 60px; width: 960px; background: url("../img/arrow-pc2-2.png") no-repeat center 22px; background-size: auto 16px;}
#Hospital #Flow .FlowInn .arrow-3:after {content: ''; display: block; position: absolute; height: 60px; width: 960px; background: url("../img/arrow-pc2-3.png") no-repeat center 22px; background-size: auto 16px;}
#Hospital #Flow .FlowInn .sec01 {background-color: #FF3D00; color: #FFF; height: 100px; line-height: 100px; font-size: 28px; border-radius: 5px;}
#Hospital #Flow .FlowInn .sec01 p{width: 100%;}
#Hospital #Flow .FlowInn .frame {line-height: 32px; font-size: 18px; margin-top: 60px; min-height: 100px;}
#Hospital #Flow .FlowInn .frame-base {display: flex; background-color: #FFF; border-radius: 5px; box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.08); align-items: center; justify-content: center; flex-direction: column;}
#Hospital #Flow .FlowInn .frame3 {width: 304px;}
#Hospital #Flow .FlowInn .frame1 {width: 100%;}
#Hospital #Flow .FlowInn .frame2 {width: 632px;}
#Hospital #Flow .FlowInn .frame4 {background-color: #FF3D00; width: 100%; color: #FFF; font-size: 24px;}
#Hospital #Flow .FlowInn .frame .att {color: #FFF; background-color: #646464; border-radius: 5px; width: 880px; height: 70px; line-height: 70px; margin: 20px 0 30px;}
#Hospital #Flow .FlowInn .frame5 {width: 100%; padding-bottom: 30px}
#Hospital #Flow .FlowInn .frame p {padding: 0 20px;}

#Hospital .detail a{font-size: 24px; line-height: 60px; height: 60px; padding-right: 84px; background: url("../img/arrow.png") no-repeat right center; background-size: 60px; text-decoration: none; display: inline-block; position: relative; left: 50%; transform: translateX(-50%);}
#Hospital .detail span {border-bottom:solid #111 2px; padding: 8px 0;}
#Hospital .detail a:hover {color: #FF3D00; transition: all 0.4s;}
#Hospital #BannerArea {padding: 100px 0;}

@media screen and (max-width : 999px ){	
	#Hospital #MV {height: 160px; padding-top: 60px; }
	#Hospital #MV h2 {margin:55px 0 0; font-size: 28px}
	#Hospital #MV h2:after {top:165px;}

	#Hospital #Flow .copy {padding: 40px 0 80px; text-align: left; font-size: 16px; line-height: 1.8em; width: 90%; margin: 0 auto;}
	#Hospital #Flow .content {padding: 0 0 10px;}
	#Hospital #Flow .FlowInn {width: 90%; top: -40px;}
	#Hospital #Flow .FlowInn .base {}
	#Hospital #Flow .FlowInn .arrow-1:after {height: 46px; width: 100%; background: url("../img/arrow-sp2-1.png") no-repeat center 16px; background-size: auto 14px;}
	#Hospital #Flow .FlowInn .arrow-2:after {height: 46px; width: 100%; background: url("../img/arrow-sp2-2.png") no-repeat center 16px; background-size: auto 14px;}
	#Hospital #Flow .FlowInn .arrow-3:after {height: 46px; width: 100%; background: url("../img/arrow-sp2-3.png") no-repeat center 16px; background-size: auto 14px;}
	#Hospital #Flow .FlowInn .sec01 {height: 80px; line-height: 80px; font-size: 22px; margin-bottom: -10px}
	#Hospital #Flow .FlowInn .frame {line-height: 24px; font-size: 14px; margin-top: 46px; min-height: 100px;}
	#Hospital #Flow .FlowInn .frame-base {}
	#Hospital #Flow .FlowInn .frame3 {width: 31%;}
	#Hospital #Flow .FlowInn .frame1 {width: 100%;}
	#Hospital #Flow .FlowInn .frame2 {width: 65.5%;}
	#Hospital #Flow .FlowInn .frame4 {font-size: 16px;}
	#Hospital #Flow .FlowInn .frame .att {width:82%; height: 40px; line-height: 40px; margin: 20px 0 0;}
	#Hospital #Flow .FlowInn .frame5 {width: 100%; padding-bottom: 0px}
	#Hospital #Flow .FlowInn .frame p {padding: 4%;}
	
	#Hospital .detail a{font-size: 16px; line-height: 48px; height: 48px; padding-right: 68px; background-size: 48px;}
	#Hospital #BannerArea {padding: 50px 0;}
}