@charset "utf-8";

/* =================================================

		libs
	 
----------------------------------------------------
*
		Base 
		loading
		Page Layout
		header
		footer
		modalOverlay
		Common Parts
*
================================================= */







/* =================================================

		Base

================================================= */

html { overflow-y: scroll;}
body {
  font-family: Yu Gothic, YuGothic M, YuGothic, '游ゴシック Medium', '游ゴシック', '游ゴシック体', 'メイリオ', 'Meiryo',"ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", sans-serif;
  font-weight: 500;
	font-size: 14px;
	line-height: 1.75;
	color: #004b70;
	background-color: #fff;
}
/*	height Full
---------------------------------------------- */
html,body { height: 100%;}

img { max-width: 100%; height: auto;}

a { text-decoration: underline; color: #004b70;}

@media screen and (min-width: 480px) and (max-width: 768px) {
  body { font-size: 3.0vw; }
}/* min-width: 460 and max-width: 768 */

@media screen and (min-width: 769px){
  body { font-size: 16px; }
  a:active { opacity: 0.75;}
  a:hover { opacity: 0.75;}
}/* min-width: 769 */







/* =================================================

		loading

================================================= */

#loading { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; -ms-flex-pack: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -ms-flex-align: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; position: fixed; width: 100%; height: 100%; left: 0px; top: 0px; background-color: #fff;}

#loading #loader { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -ms-flex-align: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center;}

#loading #loader p.loaderTxt { display: block; width: 100%; font-size: 12px; text-align: center; color: #ccc;}
#loading #loader span.loaderImg { display: inline-block; position: relative; width: 8px; height: 30px; margin: 3px; border: 1px solid #eee;}
#loading #loader span.loaderImg::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 100%;}
#loading #loader span.loaderImg:nth-child(1)::after { -webkit-animation: loader01 1.5s linear infinite; animation: loader01 1.5s linear infinite; background-color: #aaf4f5;}
#loading #loader span.loaderImg:nth-child(2)::after { -webkit-animation: loader01 1.8s linear infinite; animation: loader01 1.8s linear infinite; background-color: #77e5e7;}
#loading #loader span.loaderImg:nth-child(3)::after { -webkit-animation: loader01 1.25s linear infinite; animation: loader01 1.25s linear infinite; background-color: #3ec6cb;}

@-webkit-keyframes loader01 {
  0% { height: 0%; }
  33.33333% { height: 50%; }
  66.66667% { height: 100%; }
  100% { height: 0%; }
}
@keyframes loader01 {
  0% { height: 0%; }
  33.33333% { height: 50%; }
  66.66667% { height: 100%; }
  100% { height: 0%; }
}







/* =================================================

		Page Layout

================================================= */

/* ----------------------------------------------
		Layout
---------------------------------------------- */
#document { position: relative; width: 100%;}
#contents { position: relative;}
#footer { position: relative; padding: 1.5em 0 0; background-color: #004b70;}

body.page #document { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; min-height: 100%;}
body.page #header { position: relative; padding-top: 30px; padding-top: 4vw; padding-bottom: 40px; padding-bottom: 5.5%;}
body.page #contents { padding-bottom: 24vw;}
body.page #footer { margin-top: auto;}


@media screen and (min-width: 769px){  
  #footer { padding: 1.5em 0!important;}
  body.page #header { padding-top: 40px; padding-bottom: 40px;}
  body.page #contents { padding-bottom: 90px;}
}/* min-width: 769 */



/* ----------------------------------------------
		document bg
---------------------------------------------- */
#document { background-image: url(../img/bg.jpg); background-position: center top; background-attachment: fixed; background-size: 200% auto;}

@media screen and (min-width: 769px){
  #document { background-size: auto;}
}/* min-width: 769 */

/*	action ----------------------------------- */
/*#document { -webkit-animation: bodyBgSP 22s linear infinite; animation: bodyBgSP 22s linear infinite;}*/
@media screen and (min-width: 769px){
  #document { -webkit-animation: bodyBgPC 20s linear infinite; animation: bodyBgPC 20s linear infinite;}
}/* min-width: 769 */

/*@-webkit-keyframes bodyBgSP {
  0% { background-position: 0 0;}
  100% { background-position: -200% 0;} 
}
@keyframes bodyBgSP {
  0% { background-position: 0 0;}
  100% { background-position: -200% 0;} 
}*/

@-webkit-keyframes bodyBgPC {
  from { background-position: 0 0;}
    to { background-position: 1920px 0;} 
}
@keyframes bodyBgPC {
  from { background-position: 0 0;}
    to { background-position: 1920px 0;} 
}


/*	common inner width
---------------------------------------------- */
.cmnInr01 { width: 100%;}
.cmnInr02 { width: 720px; width: 93.75vw; padding-left: 12px; padding-right: 12px; margin-left: auto; margin-right: auto;}
.cmnInr03 { width: 648px; width: 84.375vw; margin-left: auto; margin-right: auto;}

@media screen and (min-width: 769px){
  .cmnInr02 { width: 90%; padding: 0;}
  .cmnInr03 { width: 80%; min-width: 692px;}
}/* min-width: 769 */

@media screen and (min-width: 1024px){
  .cmnInr01 { width: 960px; margin-left: auto; margin-right: auto;}
  .cmnInr02 { width: 940px;}
  .cmnInr03 { width: 800px; min-width: 0; min-width: auto; min-width: initial;}
}/* min-width: 1024 */



/* ----------------------------------------------
		z-index
---------------------------------------------- */
#loading { z-index: 10000;}
.pageToInquiry { z-index: 999;}
body.modalOpen #document { z-index: 998;}
body.modalOpen .modalOverlay { z-index: 1000;}



/* ----------------------------------------------
		page to top
---------------------------------------------- */
#footer a.pageToTop { position: absolute; left: 0; right: 0; top: -18vw; display: block; width: 101px; width: 13.15vw; min-width: 50px; height: 0; padding-top: 18%; margin: 0 auto; overflow: hidden; white-space: nowrap; text-indent: 100%; background: url(../img/btn_pagetop.png) no-repeat; background-size: 100% auto;}

@media screen and (min-width: 769px){
  #footer a.pageToTop { top: -70px; width: 51px; padding-top: 52px;}
}/* min-width: 769 */



/* ----------------------------------------------
		page to inquiry
---------------------------------------------- */
.pageToInquiry { position: fixed; bottom: 0; display: block; width: 100%; padding: 0.8em 0.5em; border-top: 1px solid #fff; text-align: center; text-decoration: none; font-size: 114%; font-weight: bold; line-height: 1.2em; color: #fff; background-color: #ff901f; opacity: 1; cursor: pointer;}
.pageToInquiry .ico { position: relative; display: inline-block; padding: 0 2em 0 1em; text-align: center;}
.pageToInquiry .ico::before,
.pageToInquiry .ico::after { content: ""; position: absolute; top: 0; bottom: 0; margin: auto;}
.pageToInquiry .ico::before { right: 0; width: 1.5em; height: 1.5em; border-radius: 50%; background-color: #fff;}
.pageToInquiry .ico::after { right: 0.6em; width: 0.5em; height: 0.5em; border: 3px solid; border-color: #ff901f #ff901f transparent transparent; -webkit-transform: rotate(45deg); transform: rotate(45deg);}

@media screen and (min-width: 769px){
  .pageToInquiry { bottom: 20px; right: 0; display: inline-block; width: auto; padding: 0.8em 1.25em; border: 1px solid #fff; border-right: 0; border-radius: 10px 0 0 10px; text-align: center; text-decoration: none; font-size: 14px; line-height: 1.4em; color: #fff; background-color: #ff901f; opacity: 1; cursor: pointer;}
  .pageToInquiry .ico { padding: 0 0 2em;}
  .pageToInquiry .ico::before,
  .pageToInquiry .ico::after { left: 0; right: 0; top: auto;}
  .pageToInquiry .ico::before { bottom: 0;}
  .pageToInquiry .ico::after { bottom: 0.5em; left: -0.2em; width: 0.5em; height: 0.5em; }
  
}/* min-width: 769 */









/* =================================================

		header

================================================= */

body.page #header::before { content: ""; position: absolute; left: 60px; left: 7.8%; top: 0; width: 116px; width: 15.1%; min-width: 80px; height: 0px; padding-top: 60px; padding-top: 20%; margin-top: 24px; margin-top: 3.125%; background: url(../img/img_hero_sml.png) left top no-repeat; background-size: 100% auto;}

body.page #header .siteLogo { position: relative; width: 200px; width: 26%; min-width: 94px; margin-left: auto; margin-right: auto;}


@media screen and (min-width: 769px){  
  body.page #header::before { left: 26px; width: 116px; height: 0px; padding-top: 60px; margin-top: 24px;}
  body.page #header .siteLogo { width: 120px;}
}/* min-width: 769 */


/*	action ----------------------------------- */
body.page #header::before { -webkit-animation: headerImgSP 2s linear infinite; animation: headerImgSP 2s linear infinite; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%;}
@media screen and (min-width: 769px){  
  body.page #header::before { -webkit-animation: headerImgPC 2s linear infinite; animation: headerImgPC 2s linear infinite; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%;}
}
@-webkit-keyframes headerImgSP {
  0% { -webkit-transform: translateY(0) translateX(0); }
  33.33333% { -webkit-transform: translateY(-5px) translateX(0px); }
  66.66667% { -webkit-transform: translateY(0) translateX(-5px); }
  100% { -webkit-transform: translateY(0) translateX(0); }
}
@keyframes headerImgSP {
  0% { transform: translateY(0) translateX(0); }
  33.33333% { transform: translateY(-5px) translateX(0px); }
  66.66667% { transform: translateY(0) translateX(-5px); }
  100% { transform: translateY(0) translateX(0); }
}
@-webkit-keyframes headerImgPC {
  0% { -webkit-transform: translateY(0) translateX(0); }
  33.33333% { -webkit-transform: translateY(-10px) translateX(0px); }
  66.66667% { -webkit-transform: translateY(10px) translateX(-10px); }
  100% { -webkit-transform: translateY(0) translateX(0); }
}
@keyframes headerImgPC {
  0% { transform: translateY(0) translateX(0); }
  33.33333% { transform: translateY(-10px) translateX(0px); }
  66.66667% { transform: translateY(10px) translateX(-10px); }
  100% { transform: translateY(0) translateX(0); }
}







/* =================================================

		footer

================================================= */

#footer .footerInfo { text-align: center; font-size: 86%; color: #fff;}
#footer .footerInfoLink { display: inline-block; text-decoration: underline; color: #fff;}
#footer .footerInfoLink:not(:first-of-type) { margin-left: 1.5em; }
#footer .footerInfoCopyright { font-family: "Droid Sans", 'Verdana', sans-serif; color: #fff;}
#footer .footerInfoLink + .footerInfoCopyright { padding-top: 1em;}

@media screen and (min-width: 769px){  
  #footer .footerInfo { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: justify; -webkit-box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; text-align: left;}
  #footer .footerInfoCopyright { margin-left: auto; text-align: right;}
  #footer .footerInfoLink + .footerInfoCopyright { padding-top: 0;}
}/* min-width: 769 */







/* =================================================

		contents

================================================= */

/* ----------------------------------------------
		page - privacypolicy
---------------------------------------------- */

body#privacypolicyPage #privacypolicy .ppFrame { border-radius: 40px; border-radius: 1.4em; padding: 30px; padding: 1.25em; background-color: #fff;}
body#privacypolicyPage #privacypolicy .ppTtl { text-align: center; font-size: 114%; line-height: 1.4em;}
body#privacypolicyPage #privacypolicy .ppSubTtl { margin-top: 1.5em; font-size: 86%;}
body#privacypolicyPage #privacypolicy .ppTxtBox { padding-left: 1em; padding-right: 1em; font-size: 86%;}

@media screen and (min-width: 769px){
  body#privacypolicyPage #privacypolicy .ppFrame { border-radius: 30px; padding: 40px;}
  body#privacypolicyPage #privacypolicy .ppTtl { font-size: 32px;}
  body#privacypolicyPage #privacypolicy .ppSubTtl { margin-top: 1.5em; font-size: 16px;}
  body#privacypolicyPage #privacypolicy .ppTxtBox { padding-left: 1em; padding-right: 1em; font-size: 16px;}
}/* min-width: 769 */



/* ----------------------------------------------
    page - tokushoho
---------------------------------------------- */

body#tokushohoPage #tokushoho .ppFrame { border-radius: 40px; border-radius: 1.4em; padding: 30px; padding: 1.25em; background-color: #fff;}
body#tokushohoPage #tokushoho .ppTtl { text-align: center; font-size: 114%; line-height: 1.4em;}
body#tokushohoPage #tokushoho .ppSubTtl { margin-top: 1.5em; font-size: 86%;}
body#tokushohoPage #tokushoho .ppTxtBox { padding-left: 1em; padding-right: 1em; font-size: 86%;}

@media screen and (min-width: 769px){
  body#tokushohoPage #tokushoho .ppFrame { border-radius: 30px; padding: 40px;}
  body#tokushohoPage #tokushoho .ppTtl { font-size: 32px;}
  body#tokushohoPage #tokushoho .ppSubTtl { margin-top: 1.5em; font-size: 16px;}
  body#tokushohoPage #tokushoho .ppTxtBox { padding-left: 1em; padding-right: 1em; font-size: 16px;}
}/* min-width: 769 */



/* ----------------------------------------------
		page - inquiry
---------------------------------------------- */

body#inquiryPage #inquiry .inquiryFrame { border-radius: 40px; border-radius: 1.4em; padding: 30px; padding: 1.25em 0.25em 1.25em 1.25em; background-color: #fff;}
body#inquiryPage #inquiry iframe { height: 70vh; overflow-y: scroll; -webkit-overflow-scrolling: touch;}

@media screen and (min-width: 769px){
  body#inquiryPage #inquiry .inquiryFrame { border-radius: 30px; padding: 20px 15px 20px 40px;}
  body#inquiryPage #inquiry iframe { height: 100vh; overflow-y: scroll; -webkit-overflow-scrolling: none;}
}/* min-width: 769 */








/* =================================================

		modalOverlay

================================================= */

/* for JS : Start */
.modalOverlay { display: none;}

body.modalOpen #document { z-index: 998;}
body.modalOpen .modalOverlay { z-index: 1000; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-pack: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; -ms-flex-align: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center;}
/* for JS : End */


.modalOverlay { position: relative; width: 100%; min-height: 100%; padding: 40px 10px; background-color: #004b70; background-color: rgba(0,75,112,.8);}
@media all and (-ms-high-contrast: none){ .modalOverlay { height: 100%;}}/*IE11*/
.modal { position: relative; width: 92%; max-width: 640px; border-radius: 20px; background-color: #fff;}
.modalBody { padding: 40px; padding: 5vw;}
.modalCloseBtn { position: absolute; right: -1em; top: -1em; width: 3em; height: 3em; border-radius: 100%; overflow: hidden; white-space: nowrap; text-indent: 100%; background-color: #ff901f; cursor: pointer;}
.modalCloseBtn::before,
.modalCloseBtn::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: 2em; height: 0.2em; background-color: #fff;}
.modalCloseBtn::before { -webkit-transform: rotate(-45deg); transform: rotate(-45deg);}
.modalCloseBtn::after { -webkit-transform: rotate(45deg); transform: rotate(45deg);}


/*	profile
---------------------------------------------- */
#profile {}
#profile .profileTtl { padding-bottom: 0.25em; margin-bottom: 1em; border-bottom: 1px solid #004b70; text-align: center; font-size: 114%; line-height: 1.4em;}
#profile .profileName { font-size: 114%; line-height: 1.4em;}
#profile .profileTxt { margin-top: 1em; font-size: 100%;}


@media screen and (min-width: 769px){
  .modalBody { padding: 40px;}
}/* min-width: 769 */









/* =================================================

		Common Parts

================================================= */

/* ----------------------------------------------
		btn 
---------------------------------------------- */

.btn01 { display: inline-block; padding: 0.6em 1.25em; border-radius: 100em; text-align: center; text-decoration: none; font-size: 114%; line-height: 1.2em; color: #fff; background-color: #ff901f; opacity: 1; cursor: pointer;}

.btn02 { display: inline-block; padding: 0.6em 1.25em; border-radius: 100em; text-align: center; text-decoration: none; font-size: 100%; line-height: 1.2em; color: #fff; background-color: #004b70; opacity: 1; cursor: pointer;}
.btn02Lt { display: inline-block; padding: 0.6em 1.25em; border-radius: 100em; text-align: left; text-decoration: none; font-size: 100%; line-height: 1.2em; color: #fff; background-color: #004b70; opacity: 1; cursor: pointer;}

.btn01ArwRt { display: inline-block; position: relative; padding: 0.6em 3em; border-radius: 100em; text-align: center; text-decoration: none; font-size: 114%; line-height: 1.2em; color: #fff; background-color: #ff901f; opacity: 1; cursor: pointer;}
.btn01ArwRt::after { content: ""; position: absolute; right: 1em; top: 0; bottom: 0; margin: auto; width: 0.65em; height: 0.65em; border: 1px solid; border-color: #fff #fff transparent transparent; -webkit-transform: rotate(45deg); transform: rotate(45deg);}


.btnIcoPDF { position: relative;}
.btnIcoPDF { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-align: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 100%; padding-left: 2em; font-size: 100%;}
.btnIcoPDF::after { content: ""; display: block; width: 1.5em; height: 0; padding-top: 2em; margin-left: 1em; line-height: 0; background: url(../img/ico_pdf.png) left center no-repeat; background-size: 100% auto; flex: 0 0 auto;}
.btn02Lt .btnIcoPDF { padding-left: 0;}

.btnIcoNewWin { position: relative;}
.btnIcoNewWin { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-align: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; height: 100%; padding-left: 2em; font-size: 100%;}
.btnIcoNewWin::after { content: ""; display: block; width: 1.5em; height: 0; padding-top: 2em; margin-left: 1em; line-height: 0; background: url(../img/ico_new_window.png) left center no-repeat; background-size: 100% auto; flex: 0 0 auto;}


@media screen and (min-width: 769px){
}/* min-width: 769 */


@media screen and (min-width: 1024px){
}/* min-width: 1024 */



/* ----------------------------------------------
		display : mobile or desktop 
---------------------------------------------- */

.pcDisB { display: none;}
.spDisB { display: block;}
.pcDisI { display: inline;}
.spDisI { display: none;}
.pcDisIB { display: none;}
.spDisIB { display: inline-block;}
.pcVisV { visibility: hidden;}
.spVisV { visibility: visible;}

@media screen and (min-width: 769px){
  .pcDisB { display: block;}
  .spDisB { display: none;}

  .pcDisI { display: inline;}
  .spDisI { display: none;}

  .pcDisIB { display: inline-block;}
  .spDisIB { display: none;}

  .pcVisV { visibility: visible;}
  .spVisV { visibility: hidden;}
}/* min-width: 769 */







/* =================================================

		xxx

================================================= */

@media screen and (min-width: 769px){
}/* min-width: 769 */


@media screen and (min-width: 1024px){
}/* min-width: 1024 */




/*	あとで消す
---------------------------------------------- */
/*.cmnArea01 { background-color: rgba(0,0,0,.1)}
.cmnArea02 { background-color: rgba(0,255,0,.1)}
.cmnInr01 { background-color: rgba(255,0,0,.1)}
.cmnInr02 { background-color: rgba(255,0,255,.1)}

.blkLtInr,.blkRtInr { background-color: rgba(0,255,255,.2)}
.blkLtBody,.blkRtBody { background-color: rgba(255,0,255,.2)}*/








