@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

/*
font-family: 'Noto Serif JP', serif;

*/

/*------------------------------------base*/

body{
font-family: 'Noto Sans JP', sans-serif;
font-size:100%;
background: #f1e2c9;

}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}



img{width:100%;height:auto;}
/*ie*/
img { -ms-interpolation-mode: bicubic; }

a{transition: 0.3s;color:#007bc7;}
a:hover{opacity:0.5;}

div{position:relative;}

.center{text-align: center;}
.red{color:#b90015}
.sfont{font-size:80%;}
.flex{display:flex; justify-content: center; flex-flow:row wrap;}


#totop {z-index: 100;    position: fixed;    bottom:5em;    right: 1em;}
#totop a {    width: 62px;    display: block;}


@media screen and (max-width: 320px) {
.notice{font-size:75%;}
}

/* アスタリスク　注釈用 */
ul.ast {	list-style: none;font-size: 80%;margin: 0;text-align: left;}
ul.ast li {	margin: 0 0 0.25em 0;	padding-left: 1em;	text-indent: -1em;color: #000;}
ul.ast li:before {	content: "\203b";	color: #000;}
ul.ast li.red:before {	content: "\203b";	color: #f000;}

/* ドット　 */
ul.dot {	list-style: none;font-size: 90%;margin: 0;text-align: left;}
ul.dot li {	margin: 0;	padding-left: 1em;	text-indent: -1em;}
ul.dot li:before {	content: "\30FB";	color: #000;}
ul.dot ul.ast li:before {	content: "\203b";	color: #000;}


/*まる数字のスタイル*/
ol.num {
  counter-reset: my-counter;
  list-style: none;
  padding: 0;
  margin: 0 0 0.5em 0;
}
ol.num li {
font-size:100%;
  line-height: 1.5;
  padding-left: 1.25em;
  position: relative;
}
ol.num li:before {
  content: counter(my-counter);
  counter-increment: my-counter;
  border: 1px solid #000; 
  border-radius: 50%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 17px;
  width: 17px;
  font-size: 70%;
	font-weight:500;
  line-height: 1;
  position: absolute;
  top: 0.45em;
  left: 0;
}


/*メニュー要素の出現アニメ*/
.fadein { opacity: 0;  transition: 1s;}
.fadein.is-show {  opacity: 1;}

/*右から*/
.fadein_right {  opacity: 0;  transform: translate(0, 20%);  transition: 1s;}
.fadein_right.is-show {  transform: translate(0, 0);  opacity: 1;}

/*左から*/
.fadein_left {  opacity: 0;  transform: translate(-100%, 0);  transition: 3s;
  animation-name: delay;
  animation-duration: 3s;
  animation-timing-function: ease-out;
  animation-fill-mode:  forwards;
}
.fadein_left.is-show {  transform: translate(0, 0);  opacity: 1;}
/*下から*/
.fadein_up {  opacity: 0;  transform: translate(0, 10%);  transition: 1s;}
.fadein_up.is-show {  transform: translate(0, 0);  opacity: 1;}
/*上から*/
.fadein_down {  opacity: 0;  transform: translate(0, -80%);  transition: 1.5s;}
.fadein_down.is-show {  transform: translate(0, 0);  opacity: 1;}

.delay {
  animation-name: delay;
  animation-duration: 0.5s;
  animation-timing-function: ease-out;
  animation-fill-mode:  forwards;
}

@keyframes delay {
0% { opacity: 0; }   
50% { opacity: 0; }
100% { opacity: 1; }
}



/*ヘッダー*/
header{ display:block;position: relative; margin:0;}
header h1{position: absolute;top:50%;left:50%;translate: -50% -50%; width:62vw; opacity: 0;
animation-duration: 1s;
animation-name: kv_title;
animation-timing-function: ease-out;
animation-fill-mode:  forwards;
}


@keyframes kv_title {
  0% {
    opacity: 0;
      transform: translate(0,-10%); 
  } 
  100% {
    opacity: 1; 
    transform: translate(0,0);   
  }
}


/*upper*/
#header_upper{padding:1vw;position: absolute;top:0;left:0;right:0;margin:auto;opacity: 1;z-index:100;display: flex;justify-content: flex-end;}
#header_upper .logo{width:7vw;margin:0 6vw 0 0;}



section{position: relative;}
.inner{position:relative;padding:3vw 3vw;}
.line{line-height:0.5;}

#sec_upper{background: linear-gradient(to bottom,  #19185c 0%,#282896 33%,#282896 66%,#19185c 100%);}
#sec_upper .content{max-width:800px;margin:auto;}

#sec_dl {background: linear-gradient(135deg,  #aa610c 0%,#fef5e0 43%,#aa610c 100%);padding:1vw;}
#sec_dl .inner{max-width: 900px;margin:0 auto;}
#sec_dl .dl_bord{ background: #f6f0d7;padding:5%;margin:0 0 1em 0;}

#sec_dl .dl_item_wrap .item{flex-basis:57%;}
#sec_dl .dl_item_wrap .item .title{margin:0 0 9% 0;}
#sec_dl .dl_item_wrap .item .btn{}
#sec_dl .dl_item_wrap .item .btn a{flex-basis:40%;margin:0 3%;}
#sec_dl .notice_area{font-size:98%;}


/*フッター*/
footer{}
footer .inner{max-width:1440px;margin:auto;padding:2vw;}
footer .footer_link{margin:0 auto;align-items: center;}
footer .footer_link a{text-decoration:none;color:#000;}
footer .footer_link .jralogo{flex-basis:25%; }
footer .footer_link .jralogo a{width:100px; display: block;}
footer .footer_link ul{flex-basis:40%;  justify-content:center;align-items: center;font-weight:500;}
footer .footer_link ul li.bar{font-size:90%;color:#000;margin:0 0.25em;}
footer .footer_link .copyright{flex-basis:25%;font-size:70%; color:#000; text-align: right;}

@media screen and (max-width: 1270px) {
footer .footer_link{flex-flow:column;}
footer .footer_link .jralogo{margin:0 0 1em 0;}
footer .footer_link ul{margin:0 0 1em 0;}
footer .footer_link .copyright{}    
}