@charset "utf-8";

#wrapper { overflow: hidden; }

body {
  margin:0; padding:0;
  font-size:16px; color:#383630; line-height: 1.875; font-weight:500;
  -webkit-font-smoothing:antialiased;
  font-family:
    "Noto Sans JP", "游ゴシック", "Yu Gothic", YuGothic, "メイリオ", "Meiryo",
    "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;
    letter-spacing: 0.8px;
  }

a:visited { color: #383630!important; }

/* common------------------------*/
.center { text-align:center; }
.right  { text-align:right; }
.bold { font-weight:bold; }

.txt { font-size: 1.12em; color:#383630; font-weight: 500; margin-bottom: 1em; }

.flex { display:-webkit-flex; display:flex; -webkit-flex-wrap:wrap; flex-wrap:wrap; }
.flex-center { -webkit-justify-content:center; justify-content:center; }

/* main ------------- */
/*メインMV*/
.mv_wide {
  width: 100%;
  background: url("../img/s/mv_govpack.png");
  background-size: contain;
}

.mv_wide .mv_inner {
  text-align: center;
  max-width: 1084px;
  margin: 0 auto;
  padding: 3% 0;
  display: block;
  position: relative;
}

.mv_wide .mv_inner .mv_ttl {
	font-size: 2.5em;
	margin: 20px 0 15px;
    text-align: center;
	font-weight: 700;
	line-height: 1.2;
}

.mv_wide .mv_inner .mv_ttl span.tag {
	font-size: .5em;
    font-weight: normal;
	color: #fff;
    border-radius: 5px;
    background-color: #f3a214;
	padding: 5px 15px;
	font-weight: 600;
}

.mv_wide .mv_inner .logo {
	max-width: 400px;
}

.mv_wide .mv_inner .release {
	position: absolute;
	top: 10px;
	right: 100px;
}

.mv_wide .mv_inner .release span {
	display: inline-block;
	width: 230px;
	height: 35px;
	background: #db4848;
	text-align: center;
	color: #fff;
	font-weight: 600;
	font-size: 1.2em;
	line-height: 35px;
	border-radius: 5px;
}

/* link-area */
.link-area .ttl { font-size: 1.325em; font-weight: bold; letter-spacing: 2px; }
.link-area .ttl .big { padding-right: .15em; font-size: 1.45em; }

.link-area .link{ display: block; width: 100%; margin: auto; padding: 2.5% 5% 1%; background: #f5fafd; border-radius: 0.9em; overflow: hidden; position: relative; box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.1); }
.link-area > li .link { margin-left: 0; }
.link-area .link:hover { color: #383630; }
.link-area { padding: 2em 0 6em; }
.link-img { position: relative; }

.link-area .link:hover .button .button-line::after { width: 8.5em; }
.link-area .link .button .button-line::after {  display: block; content: "";  position: absolute; left: 3.5em;  bottom: .15em; width: 0px;  height: 2px;  background: #0c99f1;  -webkit-transition: all .3s;  transition: all .3s; }
.link-area .link .txt { margin: 1em 0; }

/* button */
.button { position:relative; z-index: 0; display:inline-block; overflow:hidden; min-width:260px;
  padding:.7em 3em .6em 3em; text-align:center; }
.button.icon:before { content:""; display:inline-block; width:1.2em; height:1.2em; margin:.3em .5em 0 0; vertical-align:top; background:no-repeat center / 100%; }

.link-area .button { min-width: auto; font-weight: bold; }
.link-area .link .button .button-line { margin-left: .9em; }

.c_arrow { display: block; width: 2.85em; height: 2.85em; margin: auto;
  position: absolute; top: 0; left: 0; bottom: 0; border-radius: 50%; }
.c_arrow::before,
.c_arrow::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; margin: auto; }
.c_arrow::before { left: 0; width: 1.1em; height: 2px; background: #fff;}
.c_arrow::after { left: 0.6em; width: 0.65em; height: 0.65em; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

/* btn-line-arrow */
[class^="btn-"] a {
  position:relative; display:inline-block; min-width:220px; padding:23px 42px 23px 35px; border-radius:50px; text-align:center; font-weight:bold;
}
[class^="btn-"] a::before {
	content:""; position:absolute; top:50%; right:15px; width:7px; height:7px; margin-top:-3px; border-width:2px 2px 0 0; border-style:solid; -webkit-transform:rotate(45deg); transform:rotate(45deg);
}
.btn-line-arrow a { min-width:auto; padding:0 0 0.2em 0!important; color:#0f5784!important; border-bottom:1px solid #fadd69; border-radius:0; }
.btn-line-arrow a::before { display:none; }
.btn-line-arrow a span { position:relative; display:inline-block; padding-left:2em; text-align:left; }
.btn-line-arrow a span::before, .btn-line-arrow a span::after { content:""; position:absolute; }
.btn-line-arrow a span::before { top:50%; left:0; width:23px; height:23px; margin-top:-12px; border-radius:50%; background-color:#fadd69; }
.btn-line-arrow a span::after {
	top:50%; left:7px; width:7px; height:7px; margin-top:-4px; border-width:2px 2px 0 0; border-style:solid; border-color:#0c99f1; -webkit-transform:rotate(45deg); transform:rotate(45deg);
}

/* demo */
.link-area .demo .ttl { color: #0c99f1; }
.link-area .c_arrow { right: auto; }
.link-area .demo .c_arrow { background: rgb(49,139,227); background-color: #0c99f1; }
.link-area .demo .link:hover .button .button-line{ color: #0c99f1; }
.link-area a:link { color:#383630; -webkit-transition:all .3s; transition:all .3s; text-decoration: none; }

/* about */
.about { margin: 3% 0; }
.about_ttl { 
	font-size: 2.5em;
	margin-bottom: 20px;
	text-align: center;
}

.about_ttl span {
	color: #db4848;
}

.about .about_list {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	margin-top: 30px;
}

.about .about_list li {
	background-color: #f2f3f4;
	padding: 15px 20px;
	border-radius: 10px;
	width: 32%;
}

.about .about_list li:not(last-child) {
	margin-left: 10px;
}

.about .about_list li > .con_ttl {
	font-size: 1.2em;
	color: #383630;
	font-weight: 700;
}

.about .about_list li > .con_ttl span {
	font-size: 1.5em;
	color: #9a9a9c;
	margin-right: 10px;
}

/* table */
.govpack .table_style01 {
	text-align: center;
}

.govpack .table_style01 th {
    text-align: center;
	background-color: #cbeaff;
}

.govpack .table_style01 th, .govpack .table_style01 td {
    border: 1px solid #383630;
}

.govpack .table_style01 th.tbl_lead {
	width: 40%;
}

/* button02 */
.btnBox { margin: 5.4% 0; }

.button02 { display: inline-block; min-width: 520px; padding: 1.1em 1.7em; font-size: 1.45em; 
  color: #fff!important; text-decoration: none!important; border-radius: 0.5em; position: relative; background-color: #ffa903; font-weight: bold; box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.1); }
.button02:hover { color: #fff; opacity: 0.8; }
.button02 > span { display: inline-block; text-align: left; line-height: 1.5; }
.button02::after,
.button02::before { content: ""; position: absolute; top: 0; right: 1.7em; bottom: 0; margin: auto; }
.button02::after {  width: .9em; height: 2px; background: #fff; }
.button02::before { width: 8px; height: 8px; 
  border-top: 2px solid #fff; border-right: 2px solid #fff; 
  -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.button02:visited { color: #fff!important; }


/* ================================================================
  レスポンシブ
=================================================================== */
/* 766以上(PC・タブレット) */
@media screen and (min-width: 766px) {
  .link-area .link { width: 62%; }
  .link-img { width: 34%; margin: auto; }
  .link-area > li { display:-webkit-box; display:flex; flex-wrap:wrap; -webkit-box-pack:justify; justify-content:space-between; }
  .link-area > li .link { margin-left: 0; margin-right: 4%; }
  .link-area > li .link-img { margin-left: 0; margin-right: 0; }
  .link-area .link { padding: 2em 5em; }
}

/* ================================================================
  タブレット
=================================================================== */
/* 959以下 (タブレット以下) */
@media screen and (max-width: 959px) {
  .about_ttl { 
	  font-size: 2em;
	}
	
  .about .about_list li {
	  width: 100%;
	}
	
  .about .about_list li:not(last-child) {
	  margin: 0 0 10px 0;
	}
	
  .govpack .tbl_wrap {
	  overflow: auto;
	  -webkit-overflow-scrolling:touch;
	}
	
  .govpack .tbl_wrap div.wd970 {
	  width:calc(970px - 0%);
	}
}


/* 767以下 (タブレット以下) */
@media screen and (max-width: 767px) {
	.sp_none { display:none; }
	
	nav .nav_sp_menu span,
	nav .nav_sp_menu a.is_open::after {
		font-size: 0.7em;
	}
	
	.link-area .link {  padding: 1.5em 2em 0; }
	.link-img { display: none;  }
	.link-area { padding-top: 2em; padding-bottom: 0; }
	.link-area .ttl { font-size: 1.3em; }
	.link-area .link { padding: 1.5em 2em 1em; }
	.link-area p { font-size: .9em; }
	
	[class^="btn-"] a { padding:13px 42px 13px 35px; }
	.btn-line-arrow a { font-size:.88em; }
	.btn-line-arrow a span::before { width:20px; height:20px; margin-top:-10px; }
	.btn-line-arrow a span::after { width:6px; height:6px; margin-top:-3px; }
	
	.mv_wide {
	  background-size: cover;
	  background-position: left;
	}
	.mv_wide .mv_inner .logo {
	  max-width: 250px;
	}
	.mv_wide .mv_inner .release {
		top: 10px;
		right: 10px;
	}
    .mv_wide .mv_inner .release span {
		width: 210px;
		height: 30px;
		line-height: 30px;
		font-size: 1em;
	}
    .mv_wide .mv_inner {
	  padding: 15% 5% 5%;
	}
	.mv_wide .mv_inner p.txt {
		padding: 0;
	}
}

/* ================================================================
  スマホ
=================================================================== */
@media screen and (max-width: 599px){
	.button02 { width: 100%!important; min-width: 0; padding: 1.25rem 1.5rem; } 
}