@charset 'utf-8';
/* ----- reset ----- */
*,*::before,*::after { box-sizing:border-box; }
ul[class],ol[class] { padding:0; }
body,h1,h2,h3,h4,p,ul[class],ol[class],li,figure,figcaption,blockquote,dl,dd { margin:0; }
body { min-height:100vh; scroll-behavior:smooth; text-rendering:optimizeSpeed; line-height:1.5; }
ul[class],ol[class] { list-style:none; }
a:not([class]) { text-decoration-skip-ink:auto; }
img { max-width:100%; height:auto; }
address { font-style:normal; }
article { position:relative; }
iframe { margin:0 auto; }
article > * + * { margin-top:1em; }
input,button,textarea,select { font:inherit; }
@media (prefers-reduced-motion: reduce) {
 * { animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; scroll-behavior:auto !important; }
}

/* ----- base layout ----- */
body { color:#222; font:normal 400 22px/1.8 "メイリオ",'Meiryo',sans-serif; }
dd, td { font-size:18px; }
p { margin-bottom:1em; }
nav li { list-style:none; }
a { color:#222; text-decoration:none; cursor:pointer; }
nav a:hover { color:#666; }

main { max-width:100%; }
.contents { max-width:1200px; margin:0 auto; padding:3em 1.5em; position:relative; }
h2 { flex-basis:100%; margin-bottom:2em; font-size:40px; text-align:center; color:#090c21; }
h2 > * { display:block; }
h2 i { width:100vw; overflow:hidden; color:#daeff9; font:normal normal 14vw/1 'Cormorant', serif; }
h3 { margin-bottom:1em; border-bottom:1px solid #000; color:#090c21; font:normal normal 26px/1 'Yanone Kaffeesatz', sans-serif; }

.gnav ul { display:flex; margin:0; margin-right:-2px; }
.gnav a { display:block; padding:.6em 1em;}
.gnav a:not([class]) {font-weight:bold; color:#0d6fb8; }
.gnav a.mail { margin-left:.5em; padding:.6em 1.3em .6em 3em; color:#fff; background:#0d6fb8 url(../img/icon_mail.svg) 1.3em center no-repeat; background-size:1em; }
.contactBlck { padding:4em 1.5em; color:#0d6fb8; line-height:2; text-align:center; }
.contactBlck a { display:inline-block;  padding:.6em 3.5em .6em 4em; color:#fff; font-size:1.3em; background:#0d6fb8; }
.contactBlck a img { display:inline-block; margin-right:.5em; height:1.2em; vertical-align:middle; }
/*header footer*/
header#header .contents,
footer#footer .contents { display:flex; padding:0; }
header#header { width:100%; z-index:10000; position:fixed; top:0; left:0;}
#logo { max-height:50px; margin-right:auto; font-size:100%;}
#logo img { margin:5px; height:40px; /*filter:drop-shadow(1px 1px 3px #fff); */}


#footer { 
  min-height:35vh; padding:3em 0 2em; text-align:center; color:#fff;
  background:url(../img/mv.jpg) no-repeat 0 center; background-size:cover; 
  background-color:rgb(1 43 121 / 78%); background-blend-mode:overlay; 
}
#footer small { font-size:12px; }


/**topView **/
#topView { position:relative; margin-top:-40px; background:#027fc0 url(/img/mv.jpg) no-repeat 0 center; background-size:cover; }
#topView { width:100%; height:calc(100vh + 40px); opacity:1; display:flex; align-items:center; justify-content:center; }
#topView p { margin:0; font-size:2.5vw; text-align:center; color:#fff; text-shadow:0 0 8px rgba(9,12,33,0.9); }

/**philosophyArea*/
#philosophyArea { padding-top:5em; text-align:center; }
#philosophyArea h2 strong { margin-top:-3em; }
#philosophyArea section { margin-top:5em; padding:70px 0; background:#daeff9; }
#philosophyArea section .contents { display:flex; }
#philosophyArea dl { position:relative; flex-basis:30%; margin:2%; padding:2em 3%; color:#fff; background:#2da7e0;}
#philosophyArea dt { font-size:38px; font-weight:bold; }
#philosophyArea dt:before { display:block;position: absolute; top:-70px; left:calc(50% - 45px); width:90px; height:90px; }
#philosophyArea dl:nth-child(1) dt:before { content:url(../img/icon_idea.png); }
#philosophyArea dl:nth-child(2) dt:before { content:url(../img/icon_parson.png); }
#philosophyArea dl:nth-child(3) dt:before { content:url(../img/icon_up.png); }

/**serviceArea */
#serviceArea h2 i{ margin-top:-.5em; }
#serviceArea .headling { margin-top:-70px; }
#serviceArea .headling img { display:block; width:90vw; margin-left:auto; height:300px; object-fit:cover; }
#serviceArea p { text-align:center; }
#serviceArea section { display:flex; margin:3em auto; padding:2em 2.5em 1.5em; background:#f0f9fd; }
#serviceArea section ul { margin-right:3em; }
#serviceArea section li { margin-bottom:.8em; line-height:1.5; }
#serviceArea figure img { width:100%; }

#resultsArea { }
#resultsArea li { padding-bottom:.5rem; line-height:1.4; }
.hr { height:24vh; background:url(/img/hr_results.jpg) no-repeat center center; background-size:cover; }
#companyArea { width:100%; padding:10px 0; }
#companyArea section { display:flex; }
#companyArea section > * { flex-basis:50%; }
#companyArea table { margin-right:5%; border-collapse:collapse; }
#companyArea td { padding:.5em 1em; vertical-align:top; }
#companyArea tr { border-bottom:1px solid #ccc; }
#companyArea tr:first-child td { width:4em; }
.nostyle { margin:0;padding:0;color:#666;list-style:none; }



/*====================ブレイクポイント====================*/
@media only screen and ( min-width: 768px) {

}
/*====================ブレイクポイント====================*/
@media only screen and (max-width: 768px) {
body { font-size:18px; }
#logo img { max-width:140px; }
#topView p { font-size:4vw; line-height:2; }
#topView p span { display:block; }
h2 { margin-bottom:1em; line-height:1.5; }
h2,
#philosophyArea dt { font-size:2em; }
br,
.gnav { display:none; }
/* .gnav a { text-indent:-999px; padding:.5em 1.5em; background-position:center center; } */
#philosophyArea section .contents,
#serviceArea section,
#companyArea section { display:block; }
#philosophyArea { padding-top:3em; }
#philosophyArea h2 strong { margin-top:-1em; }
#philosophyArea > div p { padding:0 1.5em; }
#philosophyArea dl { margin-top:80px; }
#philosophyArea dd { max-width:480px; margin:0 auto; }
#philosophyArea section { margin-top:3em; padding-top:0; }
#companyArea table { width:100%; margin-right:0; margin-bottom:2em; } 
#companyArea tr:first-child td { width:6em; }
#companyArea td { padding:0; line-height:1.5; }
#companyArea iframe { height:300px; }
.contactBlck { padding:0; }
.contactBlck a { padding:.6em 1em; }
}

@media only screen and (max-width: 400px) {
body { font-size:16px; }
#topView p { font-size:6vw; }
h2 { margin-bottom:.5em; line-height:1.2; }
h2 i { font-size:20vw; }
h2 span { display:block; }
h2,
#philosophyArea dt { font-size:1.5em; }
#serviceArea section { padding:1em; }
#serviceArea section ul { margin-right:0; margin:1em 0 0 1.5em; padding:0; }
td { display:block; width: 100% !important; }
#companyArea td:first-child { color:#0d6fb8; padding-top:0.5em; }
}