@charset "utf-8";

@import url("header.css");
@import url("nav.css");
@import url("footer.css");
@import url("content.css");

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');

html,
body {
 width: 100%;
 font-size: 62.5%;
 background: #fff;
}

body {
 position: relative;
}

body::before {
 content: "";
 display: block;
 width: 100vw;
 height: 100vh;
 background-image: url(../_image/common/bg.jpg);
 background-size: 100% auto;
 background-repeat: no-repeat;
 background-color: #e8f0f3;

 position: fixed;
 top: 0;
 left: 0;
}

#wrap {
 min-width: 1024px;
 overflow: hidden;
 position: relative;
}

@media only screen and (max-width:1180px) {

 html,
 body {
  font-size: 56%;
 }
}

@media only screen and (max-width:640px) {

 html,
 body {
  width: 640px;
  min-width: 640px;
  font-size: 106.67%;
  font-size: 94%;
 }

 #wrap {
  width: 640px;
  min-width: 640px;
 }

}





/* --------------------------------------------

fonts

---------------------------------------------- */
body,
input,
select,
select option,
textarea,
h1,
h2,
h3,
h4,
h5,
h6 {
 font-family: 'Noto Sans JP', sans-serif;
}

.ff-eng {
 font-family: "Outfit", sans-serif;
 font-weight: 300 !important;
 letter-spacing: 0.1em;
}

.ff-eng2 {
 font-family: Arial, sans-serif;
 font-weight: 400 !important;
}

.ff-min {
 font-family: 'Shippori Mincho', serif;
 font-weight: 400 !important;
}


body,
input,
select,
select option,
textarea,
h1,
h2,
h3,
h4,
h5,
h6 {
 font-size: 1.6rem;
 font-weight: 400;
 line-height: 1.3;
 letter-spacing: 0.05em;
 color: #343f6a;
}

h1,
h2,
h3,
h4,
h5,
h6 {
 line-height: 1.4;
}

body,
input,
select,
select option,
textarea,
table,
th,
td,
p {
 letter-spacing: 0.05em;
 font-feature-settings: "palt";
 text-align: justify;
 text-justify: inter-ideograph;
}

p {
 line-height: 1.8;
}

b,
em {
 font-weight: 600;
}

a {
 text-decoration: none;
}

a img {
 transition: 0.3s;
}

a:hover img {
 opacity: 0.6;
}


/* セレクト時の色指定 */
::selection {
 background: #d6daea;
 color: #322f29;
}

::-moz-selection {
 background: #d6daea;
 /*Firefox*/
 color: #322f29;
}



/* --------------------------------------------

#main

---------------------------------------------- */
#main {
 position: relative;
 min-height: 700px;
 margin: 0 0 8%;
 /*opacity: 0;
 animation: anime_fadeIn 0.1s ease 0s 1 forwards;
 -webkit-animation: anime_fadeIn 0.1s ease 0s 1 forwards;*/
}


.main_inner {
 position: relative;
}

.main_inner::before {
 content: "";
 display: block;
 width: 92.2%;
 height: 100%;
 background: rgba(255, 255, 255, 0.80);
 position: absolute;
 bottom: 0;
 left: 0;
 z-index: 0;
}

@media only screen and (max-width:640px) {
 .main_inner {}

 .main_inner::before {
  width: 96%;
 }

}








/* --------------------------------------------

linkBtn

---------------------------------------------- */
.linkBtn {
 display: inline-block;
 margin: 0.3em 0.5em 0.3em 0;
 min-width: 31rem;
 padding: 0.9em 2.8em 1.1em 1.5em;
 font-weight: 600;
 font-size: 1.8rem;
 line-height: 1.3;
 text-align: center;
 text-decoration: none !important;
 transition: 0.5s;

 background: #fff;
 border-radius: 10rem;
 border: 1px solid #fff;
 box-shadow: 0 0 12px rgba(50, 58, 99, 0.15);
 position: relative;
}

.linkBtn:hover {
 border: 1px solid rgba(195, 203, 214, 0.8);
 box-shadow: 0 0 5px rgba(50, 58, 99, 0.1);
}

.linkBtn::before {
 content: "";
 display: block;
 width: 4rem;
 height: 4rem;
 background-image: url(../_image/common/icon-arrow.svg);
 background-size: 50%;
 background-repeat: no-repeat;
 background-position: center;

 position: absolute;
 right: 0.5em;
 top: calc(50% - 2rem);
}

.linkBtn::after {
 display: none!important;
}

.linkBtn[target="_blank"]::before {
 background-image: url(../_image/common/icon-blank.svg);
}

.linkBtn[href*=".pdf"]::before {
 background-image: url(../_image/common/icon-pdf.png);
 background-size: 60%;
}

.linkBtn[href*=".doc"]::before,
.linkBtn[href*=".docx"]::before {
 background-image: url(../_image/common/icon-word.png);
 background-size: 60%;
}

.linkBtn[href*=".xls"]::before,
.linkBtn[href*=".xlsx"]::before {
 background-image: url(../_image/common/icon-excel.png);
 background-size: 60%;
}



.linkBtn-section {
 margin: 0.2em 0.5em 0.2em 0;
 width: 310px;
 max-width: calc(100% / 3 - 0.5em);
 padding: 0.8em 2em 0.8em 1.5em;
 font-size: 1.8rem;
}

.linkBtn-section::before {
 transform: rotate(90deg);
}



@media only screen and (max-width:640px) {
 .linkBtn {
  display: inline-block;
  width: 100%;
  max-width: none;
  margin: 0.3em auto;
  padding: 0.8em 2.5em 1.0em 1.5em;
  line-height: 1.3;
 }

 .linkBtn::before {}

.linkBtn-section {
 max-width: none;
}

}









/* --------------------------------------------

校正用　制作中ページ

---------------------------------------------- */


.pendPages {
 position: fixed;
 z-index: 1;
 top: 150px;
 right: 10%;
 width: 80%;
 font-size: 1.8rem;
 color: red;
 font-weight: 500;
 line-height: 50px;
 color: #fff;
 text-align: center;
 border: 2px solid #fff;
 background: rgba(255, 0, 0, 0.65);
 z-index: 10;
}

.pendImage-1920 {
 display: block;
 position: relative;
 left: 50%;
 width: 1920px;
 margin-left: -960px;
 display: none;
}

.pendImage-1536 {
 display: block;
 position: relative;
 left: 50%;
 width: 1536px;
 margin-left: -768px;
}

.pendImage-1536 img {
 position: relative;
}



@media only screen and (max-width:1536px) {
 .pendImage-1920 {
  display: none;
 }

 .pendImage-1536 {}
}

@media only screen and (max-width:640px) {
 .pendImage {
  width: 120vw;
  margin-left: -60vw;
 }
}