@charset "utf-8";
/* CSS Document */


/*--------------------------------------------------------------------------
   reset
---------------------------------------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
small,
dl,
dt,
dd,
ol,
ul,
li {
  margin: 0;
  font-size: 100%;
}

ul {
  margin: 0;
  padding: 0;
  vertical-align: baseline;
}

img {
vertical-align: top;
-webkit-backface-visibility: hidden;
}

li {
  list-style-type: none;
  vertical-align: baseline;
}

input, button, textarea, select {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
/*	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;*/
}

/*--------------------------------------
　Base
---------------------------------------*/
*{
box-sizing: border-box;
}


body {
	color: #333333;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
	font-size: 15px;
	line-height: 1.8em;
}

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

a {
color: #333;
text-decoration: none;
}

/* Micro clearfix */

/* For modern browsers */
.cf:before,.cf:after { content:""; display:table; }
.cf:after { clear:both; }
/* For IE 6/7 (trigger hasLayout) */
.cf { zoom:1; }


.flImg{
float:left;
}
.frImg{
float:right;
}





h1,h2,h3,h4,h5,h6{
padding: 0;
line-height:1.3;
font-weight:500;
}


.mainWrap .catch, .mainWrap .sttl{
margin: 0 0 16px;
font-weight: 500;
font-size:2.2rem;
line-height: 1.5;
}

.fontMin{
font-family: 'Noto Serif JP', serif;
font-weight: 400;
}
.fontNS{
font-family: 'Noto Sans JP', sans-serif;
font-weight: 400;
}

.fontBold{
font-weight: 700;
}
.fontBl{
color: #2577b1;
}
.fontGr{
color: #666;
}
.align_ct{
text-align: center;
}
.align_r{
text-align: right;
}

html {
  font-size: 62.5%;
}



/*------------
600px--common
------------*/
.sp{
display:none!important;
}


body{
position: relative;
width: 100%;
min-width:1100px;
/*overflow-x: hidden;*/
font-size:1.6em;
line-height:2.0;
font-family: 'Noto Serif JP', serif;
font-weight: 400;
}
.forTab{
overflow: hidden;
}

a{
transition: all .2s ease-in-out;
}
a:hover{
opacity: 0.7;
}


.mainWrap h1, .mainWrap h2, .mainWrap h3, .mainWrap h4, .mainWrap h5, .mainWrap h6{
}
.mainWrap h1 a, .mainWrap h2 a, .mainWrap h3 a, .mainWrap h4 a, .mainWrap h5 a, .mainWrap h6 a{
text-decoration: none;
}
.mainWrap h1 a:hover, .mainWrap h2 a:hover, .mainWrap h3 a:hover, .mainWrap h4 a:hover, .mainWrap h5 a:hover, .mainWrap h6{
opacity: 0.7;
}

.areaInner{
width: 1100px;
margin: 0 auto;
}

.fontEng{
font-family: "Times New Roman", Times, "serif";
}
.fontS{
font-size: 70%;
}


/*--------------------------------------
　Header_PC
---------------------------------------*/
nav{
position: fixed;
width: 250px;
top: 15vw;
}
nav li{
position: relative;
margin: 0 0 50px;
text-align: right;
}
nav li::before{
content: "";
position: absolute;
top: 12px;
left: 0;
width: 120px;
height: 1px;
background: #46494c;
}
nav a{
font-size:2.4rem;
font-family: "Times New Roman", Times, "serif";
line-height: 1.3;
}

.mainWrap{
margin: 0 0 0 300px;
padding: 15vw 5vw 5vw 0;
}

h1{
margin: 0 0 400px;
text-align: center;
}
h1 img{
width: 160px;
margin: 0 auto 40px;
}
h1 .txt{
font-size:2.4rem;
}

.sect{
padding: 14vw 0 300px 50px;
}
.sect h2{
margin: 0 0 40px;
font-size:22px;
font-size:2.2rem;
}
.sect h2 .fontEng{
display: block;
font-size:9.2rem;
line-height: 1.1;
}
.sect p{
line-height: 2.5;
}
.sect p a{
text-decoration: underline;
}
.sect p a:hover{
text-decoration: none;
}

footer{
background: #000;
padding: 36px 20px;
text-align: center;
}
footer small{
font-size:1.2rem;
font-family: Arial, Helvetica, "sans-serif";
color: #fff;
}


/* #sect02 */
#sect02 .mini{
margin: 0 0 80px;
padding: 30px 0;
border-top: 1px solid #46494c;
}
#sect02 h3{
margin: 0 0 40px;
font-size:3.0rem;
text-align: center;
}
#sect02 ul{
display: flex;
flex-wrap: wrap;
}
#sect02 li{
width: calc((100% - 6vw) / 3);
margin: 0 3vw 3vw 0;
}
#sect02 li:nth-child(3n){
margin: 0 0 3vw;
}
#sect02 li .flame{
margin: 0 0 .7vw;
box-shadow: 4px 6px 10px rgba(40,39,41,.2);
}
#sect02 li .flame img{
width: 100%;
}
#sect02 li .cap{
font-size:1.5rem;
line-height: 1.5;
}
#sect02 li .cap .fontS{
font-size:1.2rem;
}
#sect02 .botCap{
font-size:1.4rem;
line-height: 1.5;
text-align: center;
}


/*===モーダル表示のためのcss　*/

.hide-area{/*モーダル表示をする場所をあらかじめ隠す*/
	display: none;
}


.modaal-container{
width: 60%;
background: none;
box-shadow: none;
}
.modaal-content-container {
padding: 0;
}
.modaal-content-container .flame{
margin: 0 0 30px;
}
.modaal-content-container .flame img{
width: 100%;
}

.modaal-fullscreen .modaal-content-container{/*full画面の色設定*/
	background: #333;
	color: #fff;
	text-align: center;
}

.modaal-fullscreen .modaal-close{/*ボタンの色、位置*/
	background:none;
	right:20px;
}

/*クローズボタンの×の色変更*/
.modaal-close {
    right: 20px;
    top: 10px;
}

.modaal-close:after, .modaal-close:before {
    width: 2px;
    height: 22px;
    border-radius: 0;
}



/*キャプション*/
.caption{
    display: block;
    padding: 10px 0;
    color: #fff;
}

/*===　サムネイル表示のためのcss　*/


/*画像の横幅を100%にしてレスポンシブ化*/
img{

}



#webds .botCap{
margin: 10px 0;
}
#webds ul{
margin: 80px 0 0;
}
#webds li .cap .fontS{
display: block;
margin: 3px 0 0;
}




/* End_PC */













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


/*------------
common--767px
------------*/

.sp{
display:block!important;
}

.pc{
display:none!important;
}



body{
min-width:0;
font-size:1.5em;
}

a:hover{
opacity: 1.0;
}


nav{
position: static;
width: auto;
margin: 20px 0 0; 
}
nav ul{
text-align: center;
}
nav li{
display: inline-block;
margin: 0 0 50px;
padding: 0 5%;
text-align: left;
}
nav li::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
background: none;
}
nav a{
font-size:1.5rem;
}

.mainWrap{
margin: 0;
padding: 160px 0 0;
}

h1{
margin: 0 0 200px;
text-align: center;
}
h1 img{
width: 100px;
margin: 0 auto 40px;
}
h1 .txt{
font-size:1.8rem;
}

.sect{
padding: 14vw 5vw 100px;
}

.sect h2{
margin: 0 0 40px;
font-size:1.8rem;
}
.sect h2 .fontEng{
display: block;
margin: 0 0 10px;
font-size:5.0rem;
line-height: 1.1;
}
.sect p{
line-height: 2.5;
}
.sect p a{
text-decoration: underline;
}
.sect p a:hover{
text-decoration: underline;
}



/* #sect02 */
#sect02 .mini{
margin: 0 0 40px;
}
#sect02 h3{
margin: 0 0 20px;
font-size:2.0rem;
text-align: center;
}
#sect02 ul{
display: block;
}
#sect02 li{
width: auto;
margin: 0 0 5vw 0;
}
#sect02 li:nth-child(3n){
margin: 0 0 5vw;
}
#sect02 li .flame{
margin: 0 0 2vw;
}
#sect02 li .cap{
font-size:1.3rem;
line-height: 1.5;
}
#sect02 li .cap br{
display: none;
}
#sect02 .botCap{
text-align: left;
}


.modaal-container{
width: 90%;
}
.modaal-content-container .flame {
    margin: 0 0 20px;
}
.modaal-close {
    right: 10px;
    top: 10px;
}


#webds ul{
margin: 40px 0 0;
}


}
/* End_SP */



















/* msie11_+pdtop4 */

@media all and (-ms-high-contrast:none){

*::-ms-backdrop, .mainWrap h1, .mainWrap h2, .mainWrap h3, .mainWrap h4, .mainWrap h5, .mainWrap h6{
}




*::-ms-backdrop, #g-nav .areaInner .navBox .sttl a, .mainWrap .btn-internal a, .mainWrap p[style="text-align: right;"] a.internal, .mainWrap .btn-web a{
}



}