@charset "utf-8";

/* ======================= */
#head_bg{ height:auto !important;}
#AR-7000N{
	background:#0051AA url(../images/0/bg02.jpg) no-repeat fixed;
	width:100%;
	color:#fff;
	font-size:18px;
	line-height:1.6;
	position:relative;
}
#AR-7000N,
#AR-7000N td{
	font-family:"メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:normal;
}

/* メニュ */

#con_menu{
	position:absolute;
	font-size:14px;
	z-index:10;
}
#con_menu li{
	margin-bottom:6px;
}
#con_menu a::before{
	content:"> ";
}
#con_menu li a{
	display:inline-block;
	color:#fff;
	padding:5px;
	-webkit-border-radius: 5px;
border-radius: 5px;
}
#con_menu li a:hover{
	background:rgba(255, 255, 255, 0.3);
}

#AR-7000N .inner{
	position: relative;
    width: 100%;
    max-width: 1220px;
    margin: auto;
    padding: 0 42px 0 236px;
}

.col{display:flex;	display:-webkit-flex;}

#AR-7000N .downarrow {
	text-align:center;
	width:100%;
	padding-left:16%;
	z-index:500;
}
#AR-7000N .downarrow img{ vertical-align:bottom;}

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


#AR-7000N h2{ width:100%; border-bottom:solid 1px #fff; padding:22px 3px 5px; text-align:left; font-size:30px; font-weight:bold;}
#AR-7000N h3{ margin-top:0; font-size:26px;}


/* intro --------------------------------------- */
#intro{
	font-size:16px;
	background: url(../images/0/bg01.jpg) no-repeat top center;
	background-size:auto 100%;
}
#intro .downarrow {
	margin-top:-23px;
}
#s0_1{ position:relative; z-index:50;}
.itabContents .inc { display:none; position:relative; text-align:center;}
.itabContents .active {display:block;}
.itabContents span{
	position:absolute;
	bottom:3px;
	left:0;
	font-size:9px;
}
.itabContents img{ width:auto; height:415px;}
.introtab{ display:flex;	display:-webkit-flex;}
.introtab li{ display:block; margin-right:10px; cursor:pointer;}
.introtab li.select{ display:none !important;}


#s0_2{ padding-top:85px; margin-left:70px;}
#s0_3{margin-top:10px; text-align:center;}

#intro,
#scene01,
#scene02,
#scene03,
#scene04,
#scene05,
#scene06{ position:relative; min-height:533px;}

/**/
#scene01 h3{ border-bottom:solid 1px rgba(255, 255, 255, 0.5); padding-bottom:0.5em; margin-bottom:5px;}
#scene01 h3 strong{ color:#F00;}
#scene01 strong{
	display:inline-block; vertical-align: baseline; background:#FFCC00; padding:3px 10px 0 10px; margin:0 3px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

#s1_1{
	position:absolute;
	right:748px;
}

#s1_2{ margin-left:283px;margin-bottom:28px;}
#s1_2 ul{ font-size:23px;}
#s1_2 ul li:first-child{line-height:1.8em;}
#s1_2 ul .img{ margin-left:auto; align-self:stretch;} 
#s1_2 .t_r{margin-bottom:0.7em;}

.dlist td{ font-size:20px; line-height:1.5; padding:3px 0;}
.dlist strong{ font-size:24px; color:#003399;}

#scene02 dl {align-items:flex-start; margin-top:2em;}
#scene02 dl dt{
	border: solid 1px #fff;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	width:8em;
	text-align:center;
	padding:5px;
	font-size:20px;
}
#scene02 dl dd{
	margin-left:1em;
	font-size:18px;
}
.s2_1{margin-left:55px;margin-bottom:14px;}


/**/
#scene03 h3{ margin:0;}
#s3_1{ position:relative; padding-top:50px; z-index:10;}
#s3_2{ position: absolute; top:110px; right:42px; z-index:5;}
#s3_3{margin-top:92px;}

#scene03 table{border-collapse:collapse;
word-break: break-all;
word-wrap: break-all;}
#scene03 td{
	text-align:center;
	padding:5px 12px;
	font-size:17px; line-height:1.5;
	border:solid 1px rgba(255, 255, 255, 0.8);
}
#scene03 .second td{ background:#FFCC00; color:#000; font-weight:bold;}
#scene03 .third td{ color:rgba(255, 255, 255, 0.6); font-weight:bold;}


/**/
#scene04 .col li:last-child{margin-bottom:27px;}
#s4_1{ position:absolute; left:310px; bottom:100px;}

/**/
#scene05{ font-size:20px;}
#scene05 .col:last-child{margin-bottom:30px;}
#scene05 .s05_2{margin-bottom:12px;}
/**/
#scene06{ font-size:12px; padding-bottom:72px;}
#scene06 p{ margin-bottom:10px;}

#s6_2{ margin-right:30px;}
#s6_3{z-index:50; margin-right:18px;}
#s6_4{z-index:50;}

#scene06 li a{
	display:block;
	background:#fff url(../images/06_4.png) no-repeat right 50%;
	font-size:18px;
	font-weight:bold;
	padding:10px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	margin-bottom:10px;
	text-decoration:none;
	color:#004194;
}
#scene06 li a:hover{opacity: 0.5;}


#s6_2{
	top: 140px;
	width: 540px;
}
#s6_3,
#s6_4{top:80px;	width:181px;}

#s6_3{left: 559px;}
#s6_4{left: 760px;}

.t_r{ text-align:right;}
.font12{ font-size:12px !important;}
.font14{ font-size:14px !important;}
.yellow{ color:#FFCC00;}

.bgGray{ background:#dbdbdb; padding:3em;}
.bgGraybtn a{
	z-index:50;
	position: relative;
    display: inline-block;
    margin: auto;
    font-size: 1.2rem;
    line-height: 1.3rem;
    color: #ffffff;
    background: #004295;
    border-radius: 5px;
    -webkit-transition: opacity 0.2s, background 0.2s;
    transition: opacity 0.2s, background 0.2s;
    cursor: pointer;
	padding:1em 2em;
}

/*トップへ戻るボタン*/
#page-top {
  position:fixed;
  bottom:-50px;
  right:20px;
  display:block;
	z-index:100;
}
#page-top img{ vertical-align:bottom;}

#page-top:hover {
  opacity:0.7;
}


@media all and (-ms-high-contrast:none){
  *::-ms-backdrop, #con_menu { left:100px!important; } /* IE11 */
}
@media screen and (min-width:1200px) {
	#con_menu{
		left:50%;
		transform:translateX(-50%);
		width:1220px;
		/* pointer-events: none; */
	}
	#con_menu ul{
		position: fixed;
		width: 230px;
	}

/*******************************************************/}
@media screen and (min-width:1001px) and (max-width: 1200px){#s3_2{width:55%;top: 20%;right:2%;}}
@media screen and (min-width:801px) and (max-width: 1000px){#s3_2{width:55%;top: 28%;right:2%;}}
@media screen and (min-width:601px) and (max-width: 800px){#s3_2{width:55%;top: 35%;right:2%;}}

@media screen and (min-width:601px) and (max-width: 1200px) {

	#AR-7000N img{max-width: 100% !important;height: auto;}
	
	#AR-7000N h2{font-size:30px; font-size:3vw;}
	#AR-7000N h3{font-size:26px; font-size:2.5vw;}
	#AR-7000N{font-size:18px; font-size:2vw;}
	#con_menu {
		font-size: 14px; font-size:1.3vw !important;
		z-index: 10;
	}
	#s1_2 ul {font-size: 23px; font-size:2.3vw;}
	
	* [style="font-size:20px;"],
	#scene05,
	.dlist td {font-size: 20px; font-size:1.8vw !important;}
	
	#scene06 li a{font-size: 18px; font-size:1.5vw !important;}
	* [style="font-size:14px;"]
	{font-size: 14px; font-size:1.3vw !important;}
	#AR-7000N .inner{
		max-width:100%;
		padding: 0 2% 0 19%;
	}
	
	#con_menu{ left:3%;}
	#AR-7000N .downarrow {padding-left:20%;}
	
	#intro .downarrow {margin-top:0;}
	#s0_1{ width:60%;}
	#s0_2{ width:40%; align-self:center;padding-top: 0;    margin-left: 5%;}
	
	#s1_1{ right:65%; width:55vw;}
	#s1_2 {margin-left: 23%;}
	
	.s2_0{flex:1; margin-right:1em;}
	.s2_1{margin-left: auto; width:40%; align-self:flex-end;}
	
	#s3_1,
	#s3_3{ width:50%;}

	#scene03 td{ font-size:12px; font-size:1.1vw;}
	
	#scene04 .col li{flex:1;}
	#scene04 .col li:last-child{ width:60%;}
	#s4_1 {
		position: relative;
		left:10%;
		bottom:0;
	}
	
	#scene05 dt{flex:1;}
	.s05_1{ width:68%}
	.s05_2{ width:55%}
	
	
	#scene04 br.spn,
	#scene05 br.spn{ display:none;}


/*******************************************************/}



@media screen and (min-width:601px) {
	.pcn{ display:none;}

/*******************************************************/}



/* モバイル *********************************************/
@media screen and (max-width:600px){
	.spn{ display:none;}
	#AR-7000N img{max-width: 100% !important;height: auto;}
	#AR-7000N .inner{ width:100%; max-width:100%; margin:0; padding:0 10px;}
	
	.col{flex-direction:column;}
	
	#con_menu{
		position:relative !important;
		background:#002249;
		top: auto !important;
		bottom:auto;
		left:auto;
	}
	#con_menu ul{display:flex;	display:-webkit-flex;flex-wrap:wrap;}
	#con_menu ul li{
		width:33%;
		border-left:solid 1px rgba(255, 255, 255, 0.3);
		border-bottom:solid 1px rgba(255, 255, 255, 0.3);
		margin:0;
		padding:10px;
		font-size:0.8em;
	}
	#con_menu ul li:last-child{ display:none;}
	#AR-7000N h2{ font-size:1.5rem;}
	#AR-7000N h3{ font-size:1.2rem;}
	
	#scene01,
	#scene02,
	#scene03,
	#scene04,
	#scene05,
	#scene06{ position:relative; font-size:1rem !important;}
	
	#AR-7000N .downarrow { display:none;}
	
	/* intro --------------------------------------- */
	#intro{
		background: url(../images/0/bg01.jpg) no-repeat top left;
		padding-bottom:1em;
		background-size:auto 100%;
	}
	
	#s0_1{ padding-top:30%;}
	.itabContents img{ width:80%;}
	.itabContents span{ position:relative; display:block; text-align:left;}
	#s0_2{ padding-top:10px; margin-left:0;}
	#s0_2 h1{ position:absolute; top:0; left:10px; width:55vw;}
	#s0_3{ position:absolute; top:16%; left:15%; width:25%;}
	
	
	/**/
	#s1_1{ display:none;}
	#s1_2{ margin-left:0; }
	#scene01 strong{ font-size:1.3rem;}
	#s1_2 ul
	,	.dlist td{font-size:1rem !important;}
	
	.dlist table{ table-layout:fixed;}
	.dlist td[style]{
		text-align:right;
		font-size:12px !important;
	}
	
	#s1_2 .col{flex-direction:row!important;}
	#s1_2 .col li{flex:1;}
	
	
	#scene02 dl{flex-direction:row!important;}
	#scene02 dl dt{ width:auto; font-size:1.1rem;}
	#scene02 dl dd{ font-size:1rem;}
	
	#s3_1{padding-top:1em;}
	#s3_2{ position:relative; top: inherit; right:inherit; text-align:center; padding:1em; width:100%;}
	#s3_3{ margin-top:0;}
	#scene03 .table{
	  display: block;
	  white-space: nowrap;
	  -webkit-overflow-scrolling: touch;
	 }
	
	#scene03 table{
		table-layout: fixed;
	}
	#scene03 td{font-size:3.0vw;padding:3px 8px;}
	
	
	#scene04 li{ font-size:1rem !important;}
	#s4_1{position: relative;left: inherit;bottom:inherit; text-align:right;}
	
	#scene05 dl{ margin-bottom:1em;}
	
	#scene06{ display:none;}
	.bgGray{padding:3em 10px;}
	.bgGraybtn a{ font-size:16px; font-size:4vw; padding: 1em;}
	#page-top{
		overflow:hidden;
		height:2em;
	}

/*******************************************************/}