@charset "utf-8";

/* ---------------------------------------------------------------- *
	google font
 * ---------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');

/* ---------------------------------------------------------------- *
	fonts
 * ---------------------------------------------------------------- */
@font-face {
  font-family: 'icomoon';
  src:  url('/use_the_internet_wisely/img/fonts/icomoon.eot?xk8i6p');
  src:  url('/use_the_internet_wisely/img/fonts/icomoon.eot?xk8i6p#iefix') format('embedded-opentype'),
    url('/use_the_internet_wisely/img/fonts/icomoon.ttf?xk8i6p') format('truetype'),
    url('/use_the_internet_wisely/img/fonts/icomoon.woff?xk8i6p') format('woff'),
    url('/use_the_internet_wisely/img/fonts/icomoon.svg?xk8i6p#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-ic_tel:before {
  content: "\e90b";
  color: #4b4b4b;
}
.icon-ic_movie:before {
  content: "\e90a";
}
.icon-ic_download:before {
  content: "\e909";
}
.icon-ic_check:before {
  content: "\e908";
}
.icon-ic_search:before {
  content: "\e907";
}
.icon-ic_gnaviplus:before {
  content: "\e906";
}
.icon-ic_bread:before {
  content: "\e905";
}
.icon-ic_blank:before {
  content: "\e900";
}
.icon-ic_pagetop:before {
  content: "\e901";
}
.icon-ic_ttl:before {
  content: "\e902";
}
.icon-ic_arrow:before {
  content: "\e903";
}
.icon-ic_arrow_circle:before {
  content: "\e904";
}

/* ---------------------------------------------------------------- *
	base setting
 * ---------------------------------------------------------------- */
body{
	font-family: 'Noto Sans JP', sans-serif;
}
#container{
	font-size: 16px;
}
#container.fs_large{font-size: 20px;}
#container.fs_middle{font-size: 16px;}
#container.fs_small{font-size: 14px;}

#contentsWrapper{
	padding-top: 180px;
  -webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
/* SP */
@media (max-width: 1060px) {
	#contentsWrapper{
		padding-top: 61px;
		position: relative;
	}
}

a{
  -webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
a:hover{
	opacity: .6;
}

sup{
  font-size: 83%;
  vertical-align: top;
  position: relative;
  top: -0.1em;
}

/* ---------------------------------------------------------------- *
	accessibility ON
 * ---------------------------------------------------------------- */
.PTSPK_ENABLED #header{
	margin-top: 54px;
}
/* ---------------------------------------------------------------- *
	inview
 * ---------------------------------------------------------------- */
.inview{
	opacity: 0;
  -webkit-transition: 0.8s;
  -moz-transition: 0.8s;
  -ms-transition: 0.8s;
  -o-transition: 0.8s;
  transition: 0.8s;
}
.inview.vv{
	opacity: 1;
}

/* ----- left in ----- */
.vl{
  -webkit-transform: translate(-60px, 0);
  -moz-transform: translate(-60px, 0);
  -ms-transform: translate(-60px, 0);
  -o-transform: translate(-60px, 0);
  transform: translate(-60px, 0);
}

/* ----- right in ----- */
.vr{
  -webkit-transform: translate(60px, 0);
  -moz-transform: translate(60px, 0);
  -ms-transform: translate(60px, 0);
  -o-transform: translate(60px, 0);
  transform: translate(60px, 0);
}
/* ----- bottom in ----- */
.vb{
  -webkit-transform: translate(0, 60px);
  -moz-transform: translate(0, 60px);
  -ms-transform: translate(0, 60px);
  -o-transform: translate(0, 60px);
  transform: translate(0, 60px);
}
/* ----- top in ----- */
.vt{
  -webkit-transform: translate(0, -60px);
  -moz-transform: translate(0, -60px);
  -ms-transform: translate(0, -60px);
  -o-transform: translate(0, -60px);
  transform: translate(0, -60px);
}

/* ----- in common ----- */
.vv.vl,
.vv.vr,
.vv.vb,
.vv.vt{
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
}

/* ----- repeat in ----- */
.vrpt .vrptTgtList li,
.vrpt .vrptTgt{
	opacity: 0;
  -webkit-transform: translate(0, 30px);
  -moz-transform: translate(0, 30px);
  -ms-transform: translate(0, 30px);
  -o-transform: translate(0, 30px);
  transform: translate(0, 30px);
  -webkit-transition-duration: 0.8s;
  -webkit-transition: 0.8s;
  -moz-transition: 0.8s;
  -ms-transition: 0.8s;
  -o-transition: 0.8s;
  transition: 0.8s;
}
.vrpt .vrptTgtList li.vrptActive,
.vrpt .vrptTgt.vrptActive{
	opacity: 1;
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
}

/* ---------------------------------------------------------------- *
	medhia
 * ---------------------------------------------------------------- */
/* PC */
@media (min-width: 1061px) , print{
  .no-pc { display: none !important;}
}

/* SP */
@media (max-width: 1060px) {
  .no-sp { display: none !important;}
}

.fs_large .fsNo_large{display: none;}
.fs_middle .fsNo_mid{display: none;}
.fs_small .fsNo_small{display: none;}

/* ---------------------------------------------------------------- *
	inner
 * ---------------------------------------------------------------- */
.inner{
  width: 100%;
  max-width: 1090px;
  margin: 0 auto;
}

@media (max-width: 1160px) {
  .inner{
    width: 95%;
  }
}

/* ---------------------------------------------------------------- *
	header
 * ---------------------------------------------------------------- */
#header{
	box-shadow: 0px 3px 15px 0px rgba(0,0,0,0.05);
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9999;
}

#header *{
	box-sizing: border-box;
}

/* ---------------------------------------------------------------- *
	headerTop
 * ---------------------------------------------------------------- */
#headerTop{
	background-color: #EEEDE0;
	padding-top: 21px;
	padding-bottom: 17px;
	z-index: 9999;
	position: relative;
-webkit-transition-duration: 0.2s;
-webkit-transition: 0.2s;
-moz-transition: 0.2s;
-ms-transition: 0.2s;
-o-transition: 0.2s;
transition: 0.2s;
}
/* narrow */
/* PC */
@media (min-width: 1061px) , print{
	.narrow #headerTop{
		padding-top:7px;
		padding-bottom: 7px;
	}
}
/* SP */
@media (max-width: 1060px) {
	#headerTop{
		background-color: #fff;
    padding-top: 12px;
    padding-bottom: 12px;
		height: 61px;
	}
}

#headerTop .inner{
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: space-between;
	-webkit-box-pack: space-between;
	-ms-flex-pack: space-between;
	-moz-box-pack: space-between;
	justify-content: space-between;
}
#headerTop img{
	width: 100%;
}
/* ----- logo ----- */
#headerTop .logo{
	width: 100%;
	max-width: 254px;
	-webkit-transition-duration: 0.2s;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-ms-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}
#headerTop .logo a{
	display: block;
}
/* narrow */
/* PC */
@media (min-width: 1061px) , print{
	.narrow #headerTop .logo{
		max-width: 150px;
		margin-right: 10px;
	}
}
/* SP */
@media (max-width: 1060px) {
	#headerTop .logo{
		max-width: 160px;
	}
}

/* ----- headParts ----- */
/* PC */
@media (min-width: 1061px) , print{
	#headParts{
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: flex-end;
		-ms-flex-align: flex-end;
		-webkit-align-items: flex-end;
		align-items: flex-end;
		-webkit-justify-content: start;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		-moz-box-pack: start;
		justify-content: start;
	}
}
/* SP */
@media (max-width: 1060px) {
	#headParts{
		background-color: #EEEDE0;
		padding: 30px 2.5%;
	}
	#headParts.tempHide{
		display: none;
	}
}

/* ----- accessibility ----- */
#accessibility{
	max-width: 128px;
}
#accessibility img{
	width: 100%;
	width: 128px;
}

/* ----- soumuLogo ----- */
#headParts .soumuLogo{
	width: 100%;
	max-width: 138px;
}
#headParts .soumuLogo img{
	width: 100%;
}
/* narrow */
/* PC */
@media (min-width: 1061px) , print{
	.narrow #headParts .soumuLogo{
		max-width: 92px;
	}
}

/* SP */
@media (max-width: 1060px) {
	#headParts .soumuLogo{
		margin: 30px auto 0;
	}
}

/* ---------------------------------------------------------------- *
	controlpanel
 * ---------------------------------------------------------------- */
/* PC */
@media (min-width: 1061px) , print{
	#controlpanel{
		margin-left: 30px;
		margin-right: 30px;
		-webkit-transition-duration: 0.2s;
		-webkit-transition: 0.2s;
		-moz-transition: 0.2s;
		-ms-transition: 0.2s;
		-o-transition: 0.2s;
		transition: 0.2s;
		max-width: 344px;
	}
}

/* narrow */
/* PC */
@media (min-width: 1061px) , print{
	.narrow #controlpanel{
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: start;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		-moz-box-pack: start;
		justify-content: start;
		margin-right: 10px;
		width: 100%;
    max-width: calc(344px + 200px);
	}
}

#controlpanel .controlpanel01{
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: space-between;
	-webkit-box-pack: space-between;
	-ms-flex-pack: space-between;
	-moz-box-pack: space-between;
	justify-content: space-between;
	margin-bottom: 10px;
	-webkit-transition-duration: 0.2s;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	-ms-transition: 0.2s;
	-o-transition: 0.2s;
	transition: 0.2s;
}

/* narrow */
/* PC */
@media (min-width: 1061px) , print{
	.narrow #controlpanel .controlpanel01{
		margin-right: 10px;
		margin-bottom: 0;
	}
}
/* SP */
@media (max-width: 1060px) {
	#controlpanel .controlpanel01{
		margin-bottom: 20px;
	}
}

/* ---------------------------------------------------------------- *
	fontsize
 * ---------------------------------------------------------------- */
#fontsize{
	margin-right: 10px;
}
#fontsize dl{
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: start;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	-moz-box-pack: start;
	justify-content: start;
}

#fontsize dl dt{
	margin-right: 10px;
	font-size: 16px;
}

#fontsize dl dd{
	margin-right: 10px;
}
#fontsize dl dd:last-of-type{
	margin-right: 0;
}
#fontsize dl dd a{
	display: block;
	text-decoration: none;
	color: #000;
	background-color: #fff;
	line-height: 32px;
	width: 32px;
	height: 32px;
	text-align: center;
	font-size: 18px;
}
#fontsize dl dd a:hover{
	opacity: .6;
}
.fs_large #fontsize dl dd.large a,
.fs_middle #fontsize dl dd.middle a,
.fs_small #fontsize dl dd.small a{
	color: #fff;
	background-color: #333;
}

/* narrow */
/* PC */
@media (min-width: 1061px) , print{
	.narrow #fontsize dl dt{
		display: none;
	}
}


/* ---------------------------------------------------------------- *
	search
 * ---------------------------------------------------------------- */
/* narrow */
/* PC */
@media (min-width: 1061px) , print{
	.narrow #search{
		width: 200px;
	}
}

/* ----- google search ----- */
#search form.gsc-search-box{
  border: 0;
	padding: 0;
	margin: 0;
}
#search .gsc-control-cse{
  border: 0;
	padding: 0;
}
#search table.gsc-search-box{
  margin-bottom: 0;
	padding: 0;
}
#search .gsc-search-button{
	margin: 0;
	padding: 0;
}

#search .gsc-search-button button{
  border: 0;
	margin: 0;
	background-color: #fff;
	color: #333;
	padding: 7px 23px;
	font-size: 16px;
  -webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
#search .gsc-search-button button:hover{
	background-color: #333;
	color: #fff;
	cursor: pointer;
}

#search table.gsc-search-box td.gsc-input{
  padding-right: 0;
}
#search .gsib_a{
  padding: 4px 9px 4px 9px;
}
#search .gsc-input-box{
  border: 0;
	padding: 0;
	margin: 0;
}

#search .gsc-search-button-v2 svg{
	vertical-align: bottom;
  fill: #333;
  width: 16px;
  height: 16px;
}
#search .gsc-search-button-v2:hover svg{
  fill: #fff;
}
/* ---------------------------------------------------------------- *
	gNavi
 * ---------------------------------------------------------------- */
#gNavi{
	background-color: #fff;
	line-height: 1.11;
}
/* PC */
@media (min-width: 1061px) , print{
	#gNavi .inner{
    max-width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: space-between;
		-webkit-box-pack: space-between;
		-ms-flex-pack: space-between;
		-moz-box-pack: space-between;
		justify-content: space-between;
	}
}
/* SP */
@media (max-width: 1060px) {
	#gNavi {
		position: absolute;
    z-index: 99999;
    width: 40px;
    height: 40px;
    top: 13px;
    right: 2.5%;
	}
	#gNavi .inner{
		width: 100%;
    overflow-y: scroll;
    height: calc(100vh - 61px);
		padding-bottom: 60px;
	}
	#gNaviCon{
		background-color: #fff;
		position: fixed;
		top: 61px;
		left: 0;
		right: 0;
		-webkit-transition-duration: 0.2s;
		-webkit-transition: 0.2s;
		-moz-transition: 0.2s;
		-ms-transition: 0.2s;
		-o-transition: 0.2s;
		-webkit-transform: translate(100%, 0%);
		-ms-transform: translate(100%, 0%);
		-o-transform: translate(100%, 0%);
		transform: translate(100%, 0%);
	}
	.tog_active #gNaviCon{
		-webkit-transform: translate(0%, 0%);
		-ms-transform: translate(0%, 0%);
		-o-transform: translate(0%, 0%);
		transform: translate(0%, 0%);
	}
}

#gNavi .inner > ul{
  width: 100%;
}
/* PC */
@media (min-width: 1061px) , print{
	#gNavi .inner > ul{
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: stretch;
		-webkit-align-items: stretch;
		align-items: stretch;
		-webkit-justify-content: space-between;
		-webkit-box-pack: space-between;
		-ms-flex-pack: space-between;
		-moz-box-pack: space-between;
		justify-content: space-between;
	}
}

#gNavi .inner > ul > li{
	position: relative;
}
/* PC */
@media (min-width: 1061px) , print{
	#gNavi .inner > ul > li{
		width: 20%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: stretch;
		-webkit-align-items: stretch;
		align-items: stretch;
		-webkit-justify-content: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-moz-box-pack: center;
		justify-content: center;
	}
}

#gNavi .inner > ul > li > a{
	border-bottom: 6px solid #000;
	padding-top: 12px;
	padding-bottom: 12px;
	text-decoration: none;
	color: #000;
	font-size: 112.5%;
	font-weight: 700;
	text-align: center;
	display: block;
	width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -moz-box-pack: center;
  justify-content: center;
}
/* SP */
@media (max-width: 1060px) {
	#gNavi .inner > ul > li > a{
		padding: 20px 2.5%;
		position: relative;
	}
	#gNavi .inner > ul > li > a::after{
   	font-family: 'icomoon' !important;
		content: "\e906";
		font-size: 16px;
		position: absolute;
		right: 2.5%;
		top: 50%;
		-webkit-transform: translateY(-50%) rotate(0deg);
		-ms-transform: translateY(-50%) rotate(0deg);
		-o-transform: translateY(-50%) rotate(0deg);
		transform: translateY(-50%) rotate(0deg);
		-webkit-transition-duration: 0.2s;
		-webkit-transition: 0.2s;
		-moz-transition: 0.2s;
		-ms-transition: 0.2s;
		-o-transition: 0.2s;
		transition: 0.2s;
	}
	#gNavi .inner > ul > li.mainOnly > a::after{
		content: "\e903";
		font-weight: 400;
	}
	#gNavi .inner > ul > li.open:not(.mainOnly) > a::after{
		-webkit-transform: translateY(-50%) rotate(135deg);
		-ms-transform: translateY(-50%) rotate(135deg);
		-o-transform: translateY(-50%) rotate(135deg);
		transform: translateY(-50%) rotate(135deg);
	}
}

#gNavi a:hover{
	opacity: 1;
}

/* ----- subBox ----- */
#gNavi .subBox{
	background-color: #ccc;
	padding: 20px 20px;
	display: none;
	z-index: 99;
}
/* PC */
@media (min-width: 1061px) , print{
	#gNavi .subBox{
		position: absolute;
		width: 195%;
		top: 68px;
		left: 0;
	}
	#gNavi .inner > ul > li:nth-of-type(6) .subBox,
	#gNavi .inner > ul > li:nth-of-type(7) .subBox,
	#gNavi .inner > ul > li:nth-of-type(8) .subBox{
		left: auto;
		right: 0;
	}
}
/* SP */
@media (max-width: 1060px) {
	#gNavi .subBox{
		padding: 10px 2.5%;
	}
}

#gNavi .subBox.focused{
	display: block;
}

#gNavi .subBox a{
	position: relative;
	display: block;
	font-weight: 700;
	text-decoration: none;
	color: #000;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 12px;
}
#gNavi .subBox > li a{
	padding-left: 19px;
}
/* SP */
@media (max-width: 1060px) {
	#gNavi .subBox li a{
		padding-right: 0;
	}
}

#gNavi .subBox a:hover{
	background-color: #fff;
}

#gNavi .subBox > li a::before{
  font-family: 'icomoon' !important;
  content: "\e903";
	position: absolute;
	left: 0;
  top: calc(0.3em + 10px);
  font-size: 0.6em;
	color: #000;
  -webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
#gNavi .subBox li.blank a::before{
  content: "\e900";
}
#gNavi .subBox li a:hover::before{
	left: 0.5em;
}

/* ----- layer02 ----- */
#gNavi .subBox .layer02 a{
	border-left: 4px solid #000;
	padding: 8.5px 12px 8.5px 16px;
}

/* SP */
@media (max-width: 1060px) {
	#gNavi .subBox .layer02{
		margin-top: 10px;
		margin-bottom: 10px;
	}
	#gNavi .subBox .layer02 a{
		background-color: #fff;
		padding: 15px 12px 15px 16px;
	}
}

/* ----- color variation ----- */
/*Dark color*/
#gNavi .inner > ul > li:nth-of-type(1) > a{ border-bottom-color: #FF3752;}
#gNavi .inner > ul > li:nth-of-type(2) > a{ border-bottom-color: #77BCA9;}
#gNavi .inner > ul > li:nth-of-type(3) > a{ border-bottom-color: #61A6DB;}
#gNavi .inner > ul > li:nth-of-type(4) > a{ border-bottom-color: #DB51A2;}
#gNavi .inner > ul > li:nth-of-type(5) > a{ border-bottom-color: #FFAE71;}
#gNavi .inner > ul > li:nth-of-type(6) > a{ border-bottom-color: #27C3C8;}
#gNavi .inner > ul > li:nth-of-type(7) > a{ border-bottom-color: #F9B700;}
#gNavi .inner > ul > li:nth-of-type(8) > a{ border-bottom-color: #A1BD55;}

#gNavi .inner > ul > li:nth-of-type(1) > .subBox a{	border-left-color: #FF3752;}
#gNavi .inner > ul > li:nth-of-type(2) > .subBox a{	border-left-color: #1FA580;}
#gNavi .inner > ul > li:nth-of-type(3) > .subBox a{	border-left-color: #2188D6;}
#gNavi .inner > ul > li:nth-of-type(4) > .subBox a{	border-left-color: #DB51A2;}
#gNavi .inner > ul > li:nth-of-type(5) > .subBox a{	border-left-color: #FF862A;}
#gNavi .inner > ul > li:nth-of-type(6) > .subBox a{	border-left-color: #27C3C8;}
#gNavi .inner > ul > li:nth-of-type(7) > .subBox a{	border-left-color: #F9B700;}
#gNavi .inner > ul > li:nth-of-type(8) > .subBox a{	border-left-color: #A1BD55;}

#gNavi li:nth-of-type(1) .subBox li a::before{ color: #FF3752;}
#gNavi li:nth-of-type(2) .subBox li a::before{ color: #1FA580;}
#gNavi li:nth-of-type(3) .subBox li a::before{ color: #2188D6;}
#gNavi li:nth-of-type(4) .subBox li a::before{ color: #DB51A2;}
#gNavi li:nth-of-type(5) .subBox li a::before{ color: #FF862A;}
#gNavi li:nth-of-type(6) .subBox li a::before{ color: #00b3b9;}
#gNavi li:nth-of-type(7) .subBox li a::before{ color: #f39200;}
#gNavi li:nth-of-type(8) .subBox li a::before{ color: #77a200;}

#gNavi .inner > ul > li:nth-of-type(1) > .subBox a:hover{	color: #FF3752;}
#gNavi .inner > ul > li:nth-of-type(2) > .subBox a:hover{	color: #1FA580;}
#gNavi .inner > ul > li:nth-of-type(3) > .subBox a:hover{	color: #2188D6;}
#gNavi .inner > ul > li:nth-of-type(4) > .subBox a:hover{	color: #DB51A2;}
#gNavi .inner > ul > li:nth-of-type(5) > .subBox a:hover{	color: #FF862A;}
#gNavi .inner > ul > li:nth-of-type(6) > .subBox a:hover{	color: #27C3C8;}
#gNavi .inner > ul > li:nth-of-type(7) > .subBox a:hover{	color: #f39200;}
#gNavi .inner > ul > li:nth-of-type(8) > .subBox a:hover{	color: #77a200;}

/*Light color*/
/* PC */@media (min-width: 1061px) , print{
	#gNavi .inner > ul > li:nth-of-type(1) > a:hover{	color: #FF3752;}
	#gNavi .inner > ul > li:nth-of-type(2) > a:hover{	color: #1FA580;}
	#gNavi .inner > ul > li:nth-of-type(3) > a:hover{	color: #2188D6;}
	#gNavi .inner > ul > li:nth-of-type(4) > a:hover{	color: #DB51A2;}
	#gNavi .inner > ul > li:nth-of-type(5) > a:hover{	color: #FF862A;}
	#gNavi .inner > ul > li:nth-of-type(6) > a:hover{	color: #00b3b9;}
	#gNavi .inner > ul > li:nth-of-type(7) > a:hover{	color: #f39200;}
	#gNavi .inner > ul > li:nth-of-type(8) > a:hover{	color: #77a200;}

	#gNavi .inner > ul > li:nth-of-type(1) > a:hover, .preschool #gNavi .inner > ul > li:nth-of-type(1) > a{ background-color: #FFE5E8;}
	#gNavi .inner > ul > li:nth-of-type(2) > a:hover, .under18 #gNavi .inner > ul > li:nth-of-type(2) > a{ background-color: #E7F8E9;}
	#gNavi .inner > ul > li:nth-of-type(3) > a:hover, .parent-teacher #gNavi .inner > ul > li:nth-of-type(3) > a{ background-color: #E7F4F6;}
	#gNavi .inner > ul > li:nth-of-type(4) > a:hover, .senior #gNavi .inner > ul > li:nth-of-type(4) > a{ background-color: #F8EAF2;}
	#gNavi .inner > ul > li:nth-of-type(5) > a:hover, .trouble #gNavi .inner > ul > li:nth-of-type(5) > a{ background-color: #FFF3D6;}
	#gNavi .inner > ul > li:nth-of-type(6) > a:hover, .special #gNavi .inner > ul > li:nth-of-type(6) > a{ background-color: #ECFEFF;}
	#gNavi .inner > ul > li:nth-of-type(7) > a:hover, .movie-library #gNavi .inner > ul > li:nth-of-type(7) > a{ background-color: #FFF9E9;}
	#gNavi .inner > ul > li:nth-of-type(8) > a:hover, .link #gNavi .inner > ul > li:nth-of-type(8) > a{ background-color: #F9FFE9;}
}

#gNavi .inner > ul > li:nth-of-type(1) > .subBox{	background-color: #FFE5E8;}
#gNavi .inner > ul > li:nth-of-type(2) > .subBox{	background-color: #E7F8E9;}
#gNavi .inner > ul > li:nth-of-type(3) > .subBox{	background-color: #E7F4F6;}
#gNavi .inner > ul > li:nth-of-type(4) > .subBox{	background-color: #F8EAF2;}
#gNavi .inner > ul > li:nth-of-type(5) > .subBox{	background-color: #FFF3D6;}
#gNavi .inner > ul > li:nth-of-type(6) > .subBox{	background-color: #ECFEFF;}
#gNavi .inner > ul > li:nth-of-type(7) > .subBox{	background-color: #FFF9E9;}
#gNavi .inner > ul > li:nth-of-type(8) > .subBox{	background-color: #F9FFE9;}

/*hover*/
#gNavi .subBox .layer02 a:hover{
	border-left-color: #C9C9C9 !important;
}

/* ---------------------------------------------------------------- *
	gNavi SP trigger
 * ---------------------------------------------------------------- */
/* PC */
@media (min-width: 1061px) , print{
	#gNavi .trigger{
		display: none;
	}
}
/* SP */
@media (max-width: 1060px) {
	#gNavi .trigger{
		width: 40px;
		height: 40px;
		cursor: pointer;
		display: block;
		position: relative;
		top: 0;
		right: 0;
		z-index: 99999;
		color: #000;
		-webkit-transition: all 400ms ease-in-out;
		transition: all 400ms ease-in-out;
		border: 0;
		border-radius: 50%;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		-o-user-select: none;
		user-select: none;
		-webkit-tap-highlight-color: transparent;
	}
	#gNavi .trigger span,
	#gNavi .trigger span::before,
	#gNavi .trigger span::after{
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		height: 2px;
		width: 40px;
		cursor: pointer;
		background: #333;
		display: block;
		-webkit-transition-duration: 0.2s;
		-webkit-transition: 0.2s;
		-moz-transition: 0.2s;
		-ms-transition: 0.2s;
		-o-transition: 0.2s;
		transition: 0.2s;
		-webkit-transform: translate(-50%, -10px);
		-ms-transform: translate(-50%, -10px);
		-o-transform: translate(-50%, -10px);
		transform: translate(-50%, -10px);
	}

	#gNavi .trigger p{
		position: absolute;
		bottom: 5px;
		left: 0;
		right: 0;
		margin: auto;
		text-align: center;
		-webkit-transition-duration: 0.2s;
		-webkit-transition: 0.2s;
		-moz-transition: 0.2s;
		-ms-transition: 0.2s;
		-o-transition: 0.2s;
		transition: 0.2s;
	}
	.tog_active #gNavi .trigger p{
		bottom: 0;
	}

	#gNavi .trigger p::before{
		content: "メニュー";
		font-weight: 700;
		font-size: 10px;
	}
	.tog_active #gNavi .trigger p::before{
		content: "閉じる";
	}

	.tog_active #gNavi .trigger span,
	.tog_active #gNavi .trigger span::before,
	.tog_active #gNavi .trigger span::after{
		background: #000;
		box-shadow: none;
	}
	#gNavi .trigger span::before{
		-webkit-transform: translate(-50%, -9px);
		-ms-transform: translate(-50%, -9px);
		-o-transform: translate(-50%, -9px);
		transform: translate(-50%, -9px);
	}
	#gNavi .trigger span::after{
		-webkit-transform: translate(-50%, 7px);
		-ms-transform: translate(-50%, 7px);
		-o-transform: translate(-50%, 7px);
		transform: translate(-50%, 7px);
	}
	/* メニュー展開 */
	.tog_active #gNavi .trigger span{
		background-color: transparent !important;
	}
	.tog_active #gNavi .trigger span::before{
		-webkit-transform: translateX(-50%)rotate(45deg);
		-ms-transform: translateX(-50%)rotate(45deg);
		-o-transform: translateX(-50%)rotate(45deg);
		transform: translateX(-50%)rotate(45deg);
		top: 0;
	}

	.tog_active #gNavi .trigger span::after{
		-webkit-transform: translateX(-50%)translateY(-10px)rotate(-45deg);
		-ms-transform: translateX(-50%)translateY(-10px)rotate(-45deg);
		-o-transform: translateX(-50%)translateY(-10px)rotate(-45deg);
		transform: translateX(-50%)translateY(-10px)rotate(-45deg);
		top: 10px;
	}
}

/* ---------------------------------------------------------------- *
	bread
 * ---------------------------------------------------------------- */
#bread{
	background-color: #fff;
	padding: 6px 0;
	margin: 20px 0;
	font-size: 87.5%;
}
#bread ul{
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	-webkit-align-items: start;
	align-items: start;
	-webkit-justify-content: start;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	-moz-box-pack: start;
	justify-content: start;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

#bread ul li{
	font-weight: 400;
	position: relative;
}
#bread ul li::after{
	display: inline-block;
	vertical-align: middle;
  content: "\e905";
	font-family: 'icomoon' !important;
	font-size: 10px;
  padding: 0 10px;
}

#bread ul li:last-of-type::after{
	display: none;
}

#bread ul a{
	display: inline-block;
	text-decoration: none;
	color: #000;
	font-weight: 400;
}

/* ---------------------------------------------------------------- *
	pagetop
 * ---------------------------------------------------------------- */
#pagetop{
	height: 80px;
	width: 100%;
	margin-top: 20px;
	padding-top: 10px;
	position: relative;
}
#pagetop.endPage a{
	position: relative;
	margin-left: auto;
}

#pagetop a{
  opacity: 0;
  visibility: hidden;
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 999;
	text-align: center;
	width: 80px;
	height: 80px;
	border: 2px solid #fff;
	background-color: #27C3C8;
	border-radius: 50%;
	text-decoration: none;
	color: #fff;
	font-size: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-moz-box-pack: center;
	justify-content: center;
	line-height: 1;
	font-weight: 700;
  padding: 8px;
}
#pagetop a.active{
	visibility: visible;
	opacity: 1;
}
#pagetop a.active:hover{
	opacity: .6;
}
#pagetop a span{
	position: relative;
	top: -5px;
}
#pagetop a span::before{
  content: "\e901";
	font-family: 'icomoon' !important;
	display: block;
	margin: auto;
  font-size: 16px;
	font-weight: 400;
	margin-bottom: 5px;
}

/* ---------------------------------------------------------------- *
	footer
 * ---------------------------------------------------------------- */
#footer{
	position: relative;
}
#footer *{
	box-sizing: border-box;
}

#footer .footerLine{
	position: relative;
	height: 29px;
	width: 100%;
  margin-bottom: 60px;
	background: -moz-linear-gradient(left, #FFCC40, #27C3C8);
  background: -webkit-linear-gradient(left, #FFCC40, #27C3C8);
  background: linear-gradient(to right, #FFCC40, #27C3C8);
}
#footer .footerLine::before,
#footer .footerLine::after{
	content: "";
	position: absolute;
	bottom: 0;
	width: calc(50% - 11px);
  border-bottom: 19px solid #fff;
  border-left: 0 solid transparent;
  border-right: 11px solid transparent;
  height: 0;
	z-index: 1;
}
#footer .footerLine::before{
	left: 0;
}
#footer .footerLine::after{
	right: 0;
	-webkit-transform: scaleX(-1);
  -ms-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  transform: scaleX(-1);
}
#footer .footerLine .footerLine_in::after{
	content: "";
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 14px 8px 0 8px;
	border-color: #efefef transparent transparent transparent;
}
#footer.tbg_wh .footerLine .footerLine_in::after{
	border-color: #fff transparent transparent transparent;
}
#footer.tbg_orange .footerLine .footerLine_in::after{
	border-color: #fff0e9 transparent transparent transparent;
}

/* ----- logo ----- */
#footer .logo{
	max-width: 382px;
	margin: 0 auto 100px;
}
#footer .logo img{
	width: 100%;
}

/* ----- sitemap ----- */
/* PC */
@media (min-width: 1061px) , print{
	#footer .sitemap{
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: start;
		-ms-flex-align: start;
		-webkit-align-items: start;
		align-items: start;
		-webkit-justify-content: space-between;
		-webkit-box-pack: space-between;
		-ms-flex-pack: space-between;
		-moz-box-pack: space-between;
		justify-content: space-between;
	}
}

#footer .sitemap li{
	position: relative;
	font-weight: 700;
	-webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
	margin-bottom: 20px;
}
#footer .sitemap li:last-of-type{
	margin-bottom: 0;
}

/* SP */
@media (max-width: 1060px) {
	#footer .sitemap ul,
	#footer .sitemap li{
		margin-bottom: 40px;
	}
	#footer .sitemap ul:last-of-type{
		margin-bottom: 0;
	}
}

#footer .sitemap a{
	color: #000;
	text-decoration: none;
	padding-left: 30px;
	display: block;
	font-size: 125%;
}
#footer .sitemap a:hover{
	color: #27C3C8;
	opacity: 1;
	padding-left: 25px;
	padding-right: 5px;
}
#footer .sitemap li a::before{
	content: "";
	display: block;
	position: absolute;
	top: 0.7em;
	left: 0;
	width: 20px;
	height: 3px;
	background-color: #000;
	-webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
#footer .sitemap li a:hover::before{
	background-color: #27C3C8;
}

/* ----- contactTtl ----- */
#footer .contactBox{
	margin-top: 60px;
	padding-top: 60px;
	border-top: 2px solid #EFEFEF;
	text-align: center;
}
/* SP */
@media (max-width: 1060px) {
	#footer .contactBox{
		text-align: left;
	}
}

#footer .contactTtl{
	font-size: 150%;
	font-weight: 700;
}
/* SP */
@media (max-width: 1060px) {
	#footer .contactTtl{
		font-size: 112.5%;
	}
}

#footer .contactTtlSub{
	font-weight: 700;
}
/* PC */
@media (min-width: 1061px) , print{
	#footer .contactTtlSub{
		font-size: 125%;
	}
}

/* ----- soumuLogo ----- */
#footer .soumuLogo{
	max-width: 249px;
	margin: 60px auto 0;
}
#footer .soumuLogo img{
	width: 100%;
}
/* SP */
@media (max-width: 1060px) {
	#footer .soumuLogo{
		max-width: 170px;
	}
}

/* ----- footerBottom ----- */
#footer .footerBottom{
	margin-top: 30px;
}

/* PC */
@media (min-width: 1061px) , print{
	#footer .footerBottom{
		background-color: #015077;
		padding-top: 32px;
		padding-bottom: 32px;
		text-align:center;
	}
	#footer .footerBottom .inner{
		/* display: -webkit-box; */
		display: -ms-flexbox;
		/* display: -webkit-flex; */
		/* display: flex; */
		-webkit-box-align: start;
		-ms-flex-align: start;
		-webkit-align-items: start;
		align-items: start;
		-webkit-justify-content: space-between;
		-webkit-box-pack: space-between;
		-ms-flex-pack: space-between;
		-moz-box-pack: space-between;
		justify-content: space-between;
	}
}
/* SP */
@media (max-width: 1060px) {
	#footer .footerBottom .inner{
		width: 100%;
	}
}

#footer .footerBottom *{
	color: #fff;
}
#footer .footerBottom a{
	text-decoration: none;
}

/* ----- ul ----- */
#footer .footerBottom ul{
	font-size: 81.25%;
}
/* PC */
@media (min-width: 1061px) , print{
	#footer .footerBottom ul{
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: start;
		-ms-flex-align: start;
		-webkit-align-items: start;
		align-items: start;
		-webkit-justify-content: start;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		-moz-box-pack: start;
		justify-content: center;
	}
}
/* SP */
@media (max-width: 1060px) {
	#footer .footerBottom ul{
		background-color: #EFEFEF;
		padding: 20px 2.5%;
	}
	#footer .footerBottom ul li{
		margin-bottom: 10px;
	}
	#footer .footerBottom ul li:last-of-type{
		margin-bottom: 0;
	}
	#footer .footerBottom ul a{
		color: #000;
		padding-top: 10px;
		padding-bottom: 10px;
		display: block;
	}
}

/* PC */
@media (min-width: 1061px) , print{
	#footer .footerBottom ul li{
		margin-right: 64px;
	}
	#footer .footerBottom ul li:last-of-type{
		margin-right: 0;
	}
}

/* ----- copyright ----- */
#footer .footerBottom .copyright{
	font-size: 81.25%;
}
/* SP */
@media (max-width: 1060px) {
	#footer .footerBottom .copyright{
		background-color: #015077;
		padding: 20px 2.5%;
		text-align: center;
	}
}

/* ---------------------------------------------------------------- *
	btnWrap
 * ---------------------------------------------------------------- */
.btnWrap{
	text-align: center;
}
/* ----- btnBig ----- */
a.btnBig{
	text-align: center;
	padding: 16px 60px;
	display: block;
	text-decoration: none;
	color: #fff;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background: -moz-linear-gradient(left, #27C3C8, #F9B700);
  background: -webkit-linear-gradient(left, #27C3C8, #F9B700);
  background: linear-gradient(to right, #27C3C8, #F9B700);
	position: relative;
	font-size: 162.5%;
	font-weight: 700;
	box-sizing: border-box;
}
a.btnBig::after{
  content: "\e904";
	font-family: 'icomoon' !important;
	position: absolute;
	left: 20px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	font-size: 22px;
	font-weight: 400;
	line-height: 1;
	-webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
a.btnBig.ic_blank::after{
  content: "\e900";
}
a.btnBig:hover::after{
	left: 25px;
}
/* PC */
@media (min-width: 1061px) , print{
	a.btnBig{
		max-width: 700px;
	}
}
/* SP */
@media (max-width: 1060px) {
	a.btnBig{
		font-size: 125%;
		padding: 10px 60px;
	}
}
/* PC */
@media (min-width: 1061px) , print{
	a.btnBig.btnBig_mini{
		max-width: 300px;
		padding-top: 5px;
		padding-bottom: 5px;
 	 font-size: 125%;
	}
}

/* ----- btnMini ----- */
a.btnMini{
	border-radius: 999px;
	color: #fff;
	font-size: 87.5%;
	box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.1);
	position: relative;
	padding: 7px 30px;
	background: -moz-linear-gradient(left, #27C3C8, #F9B700);
  background: -webkit-linear-gradient(left, #27C3C8, #F9B700);
  background: linear-gradient(to right, #27C3C8, #F9B700);
	width: auto;
	min-width: 200px;
	max-width: 500px;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	font-weight: 700;
	bottom: 0px;
	right: 0px;
	margin: 0 auto 2px;
	box-sizing: border-box;
}
a.btnMini:hover{
	box-shadow: 0px 3px 10px 0px rgba(0,0,0,0.0);
	bottom: -2px;
	right: -2px;
}
a.btnMini::after{
  content: "\e903";
	position: absolute;
	font-family: 'icomoon' !important;
	right: 20px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	font-size: 5px;
	font-weight: 400;
	-webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
a.btnMini:hover::after{
	right: 15px;
}
a.btnMini.bm_ps{
	background: -moz-linear-gradient(left, #F9B700, #FF3752);
  background: -webkit-linear-gradient(left, #F9B700, #FF3752);
  background: linear-gradient(to right, #F9B700, #FF3752);
}
a.btnMini.bm_un{
	background: -moz-linear-gradient(left, #F9B700, #1FA580);
  background: -webkit-linear-gradient(left, #F9B700, #1FA580);
  background: linear-gradient(to right, #F9B700, #1FA580);
}
a.btnMini.bm_pt{
	background: -moz-linear-gradient(left, #F9B700, #2188D6);
  background: -webkit-linear-gradient(left, #F9B700, #2188D6);
  background: linear-gradient(to right, #F9B700, #2188D6);
}
a.btnMini.bm_se{
	background: -moz-linear-gradient(left, #FFAE71, #DB51A2);
  background: -webkit-linear-gradient(left, #FFAE71, #DB51A2);
  background: linear-gradient(to right, #FFAE71, #DB51A2);
}
a.btnMini.bm_to{
	background: -moz-linear-gradient(left, #F9B700, #FF862A);
  background: -webkit-linear-gradient(left, #F9B700, #FF862A);
  background: linear-gradient(to right, #F9B700, #FF862A);
}

/*btnMini_blank*/
a.btnMini_blank::after{
	content: "\e900";
}

/* ---------------------------------------------------------------- *
	 btnGreen
 * ---------------------------------------------------------------- */
a.btnGreen{
	background-color: #27C3C8;
	color: #fff;
	font-size: 87.5%;
	display: block;
	border-radius: 999px;
	border: 2px solid #27C3C8;
	padding: 15px 30px;
	width: 100%;
	max-width: 470px;
	text-decoration: none;
	margin: auto;
	position: relative;
}
a.btnGreen::after{
	content: "\e903";
  font-family: 'icomoon' !important;
  position: absolute;
  right: 20px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
	-webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
	font-size: 10px;
}
a.btnGreen:hover::after{
  right: 15px;
}


/* ---------------------------------------------------------------- *
	 scrollEnd
 * ---------------------------------------------------------------- */
.btnWrap.scrollEnd {
	margin-top: 30px;
}

.btnWrap.scrollEnd a.btnMini::after {
	-webkit-transform: translateY(-50%) rotate(90deg);
	    -ms-transform: translateY(-50%) rotate(90deg);
	        transform: translateY(-50%) rotate(90deg);
}

/* ---------------------------------------------------------------- *
	page03ttlBox
 * ---------------------------------------------------------------- */
.page03ttlBox{
	box-shadow: 0px 3px 15px 0px rgb(0 0 0 / 5%);
	padding: 50px 0;
	position: relative;
	font-size: 212.5%;
}
/* SP */
@media (max-width: 1060px) {
	.page03ttlBox{
		padding: 55px 0;
	}
	.page03ttlBox .inner{
		width: 100%;
		padding: 0;
	}
}

 /* ----- page03ttlSmall ----- */
.page03ttlSmall{
	font-size: 52.941176%;
	font-weight: 700;
	display: block;
	position: relative;
	z-index: 3;
	color: #27C3C8;
	margin-top: -32px;
	margin-bottom: 5px;
}
/* SP */
@media (max-width: 1060px) {
	.page03ttlSmall{
		font-size: 47.058824%;
		padding: 0 2.5%;
		text-align: center;
		margin-top: -29px;
	}
}

 /* ----- page03ttlBig ----- */
.page03ttlBig{
	display: block;
	position: relative;
}
.page03ttlBig span{
	font-weight: 700;
	background: -moz-linear-gradient(left, #92CF9B, #22B5EA);
  background: -webkit-linear-gradient(left, #92CF9B, #22B5EA);
  background: linear-gradient(to right, #92CF9B, #22B5EA);
	display: inline-block;
	padding: 10px 70px 10px 0;
	box-sizing: border-box;
	position: relative;
	z-index: 3;
	color: #fff;
}
/* SP */
@media (max-width: 1060px) {
	.page03ttlBig span{
		font-size: 58.823529%;
		text-align: center;
		display: block;
		padding: 15px 2.5%;
		background: -moz-linear-gradient(left, #B1D686, #22B5EA);
		background: -webkit-linear-gradient(left, #B1D686, #22B5EA);
		background: linear-gradient(to right, #B1D686, #22B5EA);
	}
}

/* PC */
@media (min-width: 1061px) , print{
	.page03ttlBig::before,
	.page03ttlBig::after{
		content: "";
		display: block;
		position: absolute;
		bottom: 0;
		height: 100%;
		width: 100%;
	}

	.page03ttlBig::before{
		background: -moz-linear-gradient(left, #B1D686, #92CF9B 50%);
		background: -webkit-linear-gradient(left, #B1D686, #92CF9B 50%);
		background: linear-gradient(to right, #B1D686, #92CF9B 50%);
		left: -50%;
		z-index: 1;
	}
	.page03ttlBig::after{
		background-color: #fff;
		right: 0;
		z-index: 2;
	}
}

/* ---------------------------------------------------------------- *
	ttl_big
 * ---------------------------------------------------------------- */
.ttl_big{
	font-size: 250%;
	text-align: center;
	margin-bottom: 60px;
	font-weight: 700;
}
/* SP */
@media (max-width: 1060px) {
	.ttl_big{
		font-size: 212.5%;
	}
}
.ttl_big span{
	display: inline-block;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-moz-box-pack: center;
	justify-content: center;
}
.ttl_big span::before,
.ttl_big span::after{
  content: "\e902";
	font-family: 'icomoon' !important;
	font-size: 65%;
	display: block;
	padding-right: 13px;
	padding-top: 0.3em;
	color: #FFAE71;
}
.ttl_big span::after{
	-webkit-transform: scaleX(-1);
	-ms-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	transform: scaleX(-1);
}

/* ---------------------------------------------------------------- *
	sectionCon
 * ---------------------------------------------------------------- */
.sectionCon{
	padding-top: 60px;
	padding-bottom: 60px;
}

.bgGray{
	background-color: #efefef;
}

/* ---------------------------------------------------------------- *
	trouble slider
 * ---------------------------------------------------------------- */
.trouble_slider{
	margin-bottom: 112px !important;
  padding: 0 44px;
}

.trouble_slider a{
	display: block;
	text-decoration: none;
	position: relative;
	height: 100%;
}

.trouble_slider li{
	margin: 0 6px;
}

.trouble_slider .troubleImg{
	background-color: #fff;
	padding: 10px;
}
.trouble_slider .troubleImg img{
	width: 100%;
}

.trouble_slider .troubleTtl{
	display: block;
	background: -moz-linear-gradient(left, #FFAE71, #FF3752);
  background: -webkit-linear-gradient(left, #FFAE71, #FF3752);
  background: linear-gradient(to right, #FFAE71, #FF3752);
	text-align: center;
	color: #fff;
	padding: 15px 5px;
	height: 100%;
}
/* ----- plusItem ----- */
.trouble_slider a .plusItem,
#troubleList .troubleListBox a .plusItem{
	display: inline-block;
  position: absolute;
  padding: 4px;
  top: 0;
  left: 0;
  width: auto;
  text-align: center;
  font-size: 12px;
  line-height: 16px;
  background: #27c3c8;
  color: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  z-index: 3;
  border-radius: 0px 5px 5px 0px;
}
/* ----- consumer ----- */
.trouble_slider .consumer{
	font-size: 77.777778%;
  background-color: #fff;
  display: block;
  padding: 2px 5px;
  border-radius: 5px;
	margin-top: 10px;
	color: #000;
}
/* ----- slick ----- */
.trouble_slider .slickArrow{
	display: block;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 34px;
	height: 34px;
}
.trouble_slider .slick_prev{
	-webkit-transform: scaleX(-1) translateY(-50%);
  -ms-transform: scaleX(-1) translateY(-50%);
  -o-transform: scaleX(-1) translateY(-50%);
  transform: scaleX(-1) translateY(-50%);
	left: 0;
}
.trouble_slider .slick_next{
	right: 0;
}
.trouble_slider .slickArrow a{
	background-color: #fff;
	border-radius: 50%;
	position: relative;
	width: 100%;
	height: 100%;
}
.trouble_slider .slickArrow a::before{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 0 6px 10.4px;
	border-color: transparent transparent transparent #000000;
	position: absolute;
	left: 5px;
	right: 0;
	margin: auto;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

.trouble_slider .slick-dots{
	bottom: -62px;
	left: 0;
	right: 0;
}
.trouble_slider .slick-dots li{
	margin-bottom: 5px;
}
.trouble_slider .slick-dots li,
.trouble_slider .slick-dots li button{
	width: 12px;
	height: 12px;
}
.trouble_slider .slick-dots li button:before{
	content: "";
	width: 12px;
	height: 12px;
  border-radius: 50%;
	background-color: #CDD6DD;
	opacity: 1;
	-webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.trouble_slider .slick-dots li.slick-active button:before{
  background-color: #000;
}
.trouble_slider .slick-dots li button:hover:before{
	background-color: #27C3C8;
}

/* ---------------------------------------------------------------- *
	balloonPageTtlBox
 * ---------------------------------------------------------------- */
.balloonPageTtlBox{
	position: relative;
	margin-bottom: 82px;
	text-align: center;
	padding: 30px 0;
}
.balloonPageTtlBox::after{
	content: "";
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	bottom: -22px;
	margin: auto;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 22px 13px 0 13px;
	border-color: #ccc transparent transparent transparent;
}
/* PC */
@media (min-width: 1061px) , print{
	.balloonPageTtlBox{
		background-color: #ccc;
	}
}

/* SP */
@media (max-width: 1060px) {
	.balloonPageTtlBox{
		padding: 20px 2.5% 68px;
		overflow: hidden;
	}
	.balloonPageTtlBox::before{
		content: "";
    display: block;
    width: 100%;
    height: 100%;
    border-bottom-right-radius: 1000px 200px;
    border-bottom-left-radius: 1000px 200px;
    margin-left: -100px;
    margin-right: -100px;
    padding-left: 100px;
    padding-right: 100px;
    background: #ccc;
    position: absolute;
    bottom: 22px;
    left: 0;
    right: 0;
    z-index: 1;
	}
	.balloonPageTtlBox::after{
		bottom: 0;
	}
}

.bptIn{
	background-image: url(/use_the_internet_wisely/img/common/bpt_box_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
  	background-size: contain;
	padding: 40px 129px;
	position: relative;
	max-width: 1090px;
	margin: auto;
	z-index: 2;
}
/* SP */
@media (max-width: 1060px) {
	.bptIn{
		background-image: url(/use_the_internet_wisely/img/common/bpt_box_bg_sp.png);
		padding: 20px 0;
	}
}

.bptDeco{
	position: absolute;
	content: "";
	display: block;
	background-repeat: no-repeat;
	background-position: center center;
  background-size: contain;
	width: 130px;
}
.bptDeco img{
	width: 100%;
}
.bptDeco:nth-of-type(1){
	left: 0;
}
.bptDeco:nth-of-type(2){
	right: 0;
}
/* PC */
@media (min-width: 1061px) , print{
	.bptDeco{
		top: 50%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
	}
}

/* SP */
@media (max-width: 1060px) {
	.bptDeco{
		width: 70px;
		bottom: -50px;
	}
}

/* ----- pageTtlCatch ----- */
.bptCatch{
	font-weight: 700;
	margin-bottom: 2px;
}
.bptCatch span{
	color: #666;
	display: inline;
  padding-bottom: 1px;
  background: -moz-linear-gradient(top, transparent 60%, #FFEC73 0);
  background: -webkit-linear-gradient(top, transparent 60%, #FFEC73 0);
  background: linear-gradient(to bottom, transparent 60%, #FFEC73 0);
}
/* PC */
@media (min-width: 1061px) , print{
	.bptCatch{
		font-size: 125%;
	}
}

/* ----- balloonPageTtl ----- */
.bptTtl{
	font-size: 225%;
	font-weight: 700;
	color: #666;
}
/* SP */
@media (max-width: 1060px) {
	.bptTtl{
		font-size: 125%;
	}
}
/* ----- color variation ----- */
/* PC */
@media (min-width: 1061px) , print{
	.preschool .balloonPageTtlBox{ background-color: #FFE5E8;}
	.under18 .balloonPageTtlBox{ background-color: #E7F8E9;}
	.parent-teacher .balloonPageTtlBox{ background-color: #E7F4F6;}
	.senior .balloonPageTtlBox{ background-color: #F8EAF2;}
	.trouble .balloonPageTtlBox{ background-color: #FFF3D6;}
	.special .balloonPageTtlBox{ background-color: #ECFEFF;}
	.movie-library .balloonPageTtlBox{ background-color: #FFF9E9;}
	.link .balloonPageTtlBox{ background-color: #F9FFE9;}
}
/* SP */
@media (max-width: 1060px) {
	.preschool .balloonPageTtlBox::before{ background-color: #FFE5E8;}
	.under18 .balloonPageTtlBox::before{ background-color: #E7F8E9;}
	.parent-teacher .balloonPageTtlBox::before{ background-color: #E7F4F6;}
	.senior .balloonPageTtlBox::before{ background-color: #F8EAF2;}
	.trouble .balloonPageTtlBox::before{ background-color: #FFF3D6;}
	.special .balloonPageTtlBox::before{ background-color: #ECFEFF;}
	.movie-library .balloonPageTtlBox::before{ background-color: #FFF9E9;}
	.link .balloonPageTtlBox::before{ background-color: #F9FFE9;}
}

/*preschool*/
.preschool .bptCatch span,
.preschool .bptTtl{ color: #FF3752;}
.preschool .balloonPageTtlBox::after{border-color: #FFE5E8 transparent transparent transparent;}

/*under18*/
.under18 .bptCatch span,
.under18 .bptTtl{ color: #1FA580;}
.under18 .balloonPageTtlBox::after{border-color: #E7F8E9 transparent transparent transparent;}

/*parent-teacher*/
.parent-teacher .bptCatch span,
.parent-teacher .bptTtl{ color: #2188D6;}
.parent-teacher .balloonPageTtlBox::after{border-color: #E7F4F6 transparent transparent transparent;}

/*senior*/
.senior .bptCatch span,
.senior .bptTtl{ color: #DB51A2;}
.senior .balloonPageTtlBox::after{border-color: #F8EAF2 transparent transparent transparent;}

/*trouble*/
.trouble .bptCatch span,
.trouble .bptTtl{ color: #FF862A;}
.trouble .balloonPageTtlBox::after{border-color: #FFF3D6 transparent transparent transparent;}

/*special*/
.special .bptCatch span,
.special .bptTtl{ color: #00b3b9;}
.special .balloonPageTtlBox::after{border-color: #ECFEFF transparent transparent transparent;}

/*movie-library*/
.movie-library .bptCatch span,
.movie-library .bptTtl{ color: #f39200;}
.movie-library .balloonPageTtlBox::after{border-color: #FFF9E9 transparent transparent transparent;}

/*link*/
.link .bptCatch span,
.link .bptTtl{ color: #77a200;}
.link .balloonPageTtlBox::after{border-color: #F9FFE9 transparent transparent transparent;}


/* ---------------------------------------------------------------- *
	pdfSlider
 * ---------------------------------------------------------------- */
/* ----- pdfSlider_img ----- */
.pdfSlider .pdfSlider_img{
	margin-bottom: 20px;
}
/* SP */
@media (max-width: 1060px) {
	.pdfSlider .pdfSlider_img{
		margin-left: auto;
		margin-right: auto;
		padding: 0 40px;
	}
}

/* ----- pdfSlider_chap ----- */
.pdfSlider .pdfSlider_chap{
	border-bottom: 2px solid #efefef;
	padding-bottom: 5px;
	margin-bottom: 20px;
	display: inline-block;
	font-weight: 700;
}

/* ----- pdfSlider_ttl ----- */
.pdfSlider .pdfSlider_ttl{
	font-weight: 700;
	font-size: 114.285714%;
	margin-bottom: 5px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: start;
	-ms-flex-align: start;
	-webkit-align-items: start;
	align-items: start;
	-webkit-justify-content: start;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	-moz-box-pack: start;
	justify-content: start;
}
.pdfSlider .pdfSlider_ttl span{
	vertical-align: middle;
}
.pdfSlider .pdfSlider_ttl span.num{
	color: #000;
	font-size: 150%;
	margin-right: 5px;
}
.pdfSlider .pdfSlider_ttl span:not(.num){
	margin-top: 0.4em;
}

/* ----- btnWrap ----- */
.pdfSlider .btnWrap{
	margin-top: 30px;
}

/* ----- color variation ----- */
/*preschool*/
.preschool .pdfSlider .pdfSlider_chap{ border-bottom-color: #FF3752;}
.preschool .pdfSlider .pdfSlider_ttl span.num{ color: #FF3752;}

/*under18*/
.under18 .pdfSlider .pdfSlider_chap{ border-bottom-color: #77BCA9;}
.under18 .pdfSlider .pdfSlider_ttl span.num{ color: #1FA580;}

/*parent-teacher*/
.parent-teacher .pdfSlider_chap{ border-bottom-color: #61A6DB;}
.parent-teacher .pdfSlider .pdfSlider_ttl span.num{ color: #2188D6;}

/*senior*/
.senior .pdfSlider .pdfSlider_chap{ border-bottom-color: #DB51A2;}
.senior .pdfSlider .pdfSlider_ttl span.num{ color: #DB51A2;}

/*trouble*/
.trouble .pdfSlider .pdfSlider_chap{ border-bottom-color: #FFAE71;}
.trouble .pdfSlider .pdfSlider_ttl span.num{ color: #FF862A;}

/*special*/
.special .pdfSlider .pdfSlider_chap{ border-bottom-color: #27C3C8;}
.special .pdfSlider .pdfSlider_ttl span.num{ color: #00b3b9;}

/*movie-library*/
.movie-library .pdfSlider .pdfSlider_chap{ border-bottom-color: #F9B700;}
.movie-library .pdfSlider .pdfSlider_ttl span.num{ color: #f39200;}

/*link*/
.link .pdfSlider .pdfSlider_chap{ border-bottom-color: #A1BD55;}
.link .pdfSlider .pdfSlider_ttl span.num{ color: #77a200;}

/* ---------------------------------------------------------------- *
	trouble slider
 * ---------------------------------------------------------------- */
#pdfSliderCon{
	padding-top: 0;
	position: relative;
}

.PTSPK_ENABLED .pdfDlFixed{
	margin-top: 54px;
}

.pdfDl a{
	display: block;
}
.pdfDl_02 a{
	display: block;
}
/* PC */
@media (min-width: 769px) , print{
	.pdfDl{
		position: absolute;
		right: 0;
		top: -60px;
		z-index: 10;
	}
	.pdfDl02{
		position: absolute;
		right: 0;
		top: 90px;
		z-index: 10;
	}
}
/* SP */
@media (max-width: 768px) {
	.pdfDl{
		margin-top: 30px;
		text-align: center;
	}
	.pdfDl02{
		margin-top: 30px;
		text-align: center;
	}
}


.pdfSlider .pdfSliderInner{
	margin: auto;
}

.pdfSlider > ul{
	padding-bottom: 70px !important;
	margin-bottom: 0 !important;
}
.pdfSlider .slick-slide{
	margin: 0 30px;
}
/* PC */
@media (min-width: 1061px) , print{
	.pdfSlider .slick-slide{
		max-width: 536px;
	}
}
/* SP */
@media (max-width: 1060px) {
	.pdfSlider{
		padding: 0 2.5%;
	}
	.pdfSlider .slick-slide{
		margin: 0;
	}
}

.pdfSlider ul a{
	text-decoration: none;
}

.pdfSlider .slick-slide:not(.slick-current){
	opacity: 0.3;
}

.pdfSlider ul .pdfSlider_img img{
	width: 100%;
}

/* ----- slick ----- */

.pdfSlider ul .slickArrow{
	display: block;
	position: absolute;
	width: 55px;
	height: 55px;
	z-index: 10;
    top: calc(75% - 40px);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
/* SP */
@media (max-width: 1060px) {
	.pdfSlider ul .slickArrow{
  	top: 17%;
		width: 34px;
		height: 34px;
	}
}

.pdfSlider ul .slick_prev{
	-webkit-transform: scaleX(-1) translateY(-50%);
  -ms-transform: scaleX(-1) translateY(-50%);
  -o-transform: scaleX(-1) translateY(-50%);
  transform: scaleX(-1) translateY(-50%);
	left: 10px;
}
.pdfSlider ul .slick_next{
	right: 10px;
}
/* SP */
@media (max-width: 1060px) {
	.pdfSlider ul .slick_prev{
		left: 0px;
	}
	.pdfSlider ul .slick_next{
		right: 0px;
	}
}

.pdfSlider ul .slickArrow a{
	display: block;
	background-color: #000;
	border: 2px solid #fff;
	border-radius: 50%;
	position: relative;
	width: 100%;
	height: 100%;
}
.pdfSlider ul .slickArrow a::before{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 11px 0 11px 20px;
	border-color: transparent transparent transparent #fff;
	position: absolute;
	left: 5px;
	right: 0;
	margin: auto;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
/* SP */
@media (max-width: 1060px) {
	.pdfSlider ul .slickArrow a::before{
		border-width: 6px 0 6px 10.4px;
	}
}

.pdfSlider ul .slick-dots{
	bottom: 0;
	left: 0;
	right: 0;
}
.pdfSlider ul .slick-dots li{
	margin-bottom: 5px;
}
.pdfSlider ul .slick-dots li,
.pdfSlider ul .slick-dots li button{
	width: 12px;
	height: 12px;
}
.pdfSlider ul .slick-dots li button:before{
	content: "";
	width: 12px;
	height: 12px;
  border-radius: 50%;
	background-color: #CDD6DD;
	opacity: 1;
	-webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.pdfSlider ul .slick-dots li.slick-active button:before{
  background-color: #000;
}
.pdfSlider ul .slick-dots li button:hover:before{
	background-color: #27C3C8;
}
/* ----- color variation ----- */
/*preschool*/
.preschool .pdfSlider ul .slick-dots li.slick-active button:before,
.preschool .pdfSlider ul .slickArrow a{ background-color: #FF3752;}

/*under18*/
.under18 .pdfSlider ul .slick-dots li.slick-active button:before,
.under18 .pdfSlider ul .slickArrow a{ background-color: #77BCA9;}

/*parent-teacher*/
.parent-teacher .pdfSlider ul .slick-dots li.slick-active button:before,
.parent-teacher .pdfSlider ul .slickArrow a{ background-color: #61A6DB;}

/*senior*/
.senior .pdfSlider ul .slick-dots li.slick-active button:before,
.senior .pdfSlider ul .slickArrow a{ background-color: #DB51A2;}

/*trouble*/
.trouble .pdfSlider ul .slick-dots li.slick-active button:before,
.trouble .pdfSlider ul .slickArrow a{ background-color: #FFAE71;}

/*special*/
.special .pdfSlider ul .slick-dots li.slick-active button:before,
.special .pdfSlider ul .slickArrow a{ background-color: #27C3C8;}

/*movie-library*/
.movie-library .pdfSlider ul .slick-dots li.slick-active button:before,
.movie-library .pdfSlider ul .slickArrow a{ background-color: #F9B700;}

/*link*/
.link .pdfSlider ul .slick-dots li.slick-active button:before,
.link .pdfSlider ul .slickArrow a{ background-color: #A1BD55;}

/* ---------------------------------------------------------------- *
	etcCon
 * ---------------------------------------------------------------- */
.etcCon .etcbox{
	background-color: #efefef;
  padding: 30px;
}
.etcCon.bgWh .etcbox{
	background-color: #fff;
}
/* SP */
@media (max-width: 1060px) {
	.etcCon .etcbox{
		padding: 20px;
	}
}

/* ----- .ttl_big ----- */
.etcCon .etcbox .ttl_big{
	margin-bottom: 20px;
}

/* ---------------------------------------------------------------- *
	pageSpecialCon
 * ---------------------------------------------------------------- */
#pageSpecialCon ul{
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: stretch;
	-ms-flex-align: stretch;
	-webkit-align-items: stretch;
	align-items: stretch;
	-webkit-justify-content: start;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	-moz-box-pack: start;
	justify-content: start;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

#pageSpecialCon li{
	background-color: #fff;
	box-shadow: 0px 3px 15px 0px rgba(0,0,0,0.05);
	margin-top: 40px;
	-webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}
#pageSpecialCon li.hideItem{
	display: none;
}

/* PC */
@media (min-width: 1061px) , print{
	#pageSpecialCon li{
		width: 32.294%;
		margin-right: 1.559%;
		margin-top: 40px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		-webkit-align-items: stretch;
		align-items: stretch;
		-webkit-justify-content: start;
		-webkit-box-pack: start;
		-ms-flex-pack: start;
		-moz-box-pack: start;
		justify-content: start;
		-ms-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#pageSpecialCon li:nth-of-type(3n){
		margin-right: 0%;
	}
	#pageSpecialCon li:nth-child(-n + 3){
		margin-top: 0;
	}
}
/* SP */
@media (max-width: 1060px) {
	#pageSpecialCon li{
		width: 100%;
		margin-top: 30px;
	}
	#pageSpecialCon li:first-of-type{
		margin-top: 0;
	}
}

#pageSpecialCon .llInfo{
	width: 100%;
}

#pageSpecialCon .llInfo a{
  display: block;
  text-decoration: none;
  color: #000;
}

/* ----- llImg ----- */
#pageSpecialCon .llImg{
	padding: 0;
}
#pageSpecialCon .llImg img{
	width: 100%;
}

/* ----- llTtl ----- */
#pageSpecialCon .llTtl{
	font-weight: 700;
	padding: 20px 24px;
}
#pageSpecialCon .llTtl::after{
	content: "";
	display: block;
	background-color: #27C3C8;
	width: 30px;
	height: 3px;
	margin-top: 10px;
}
/* SP */
@media (max-width: 1060px) {
	#pageSpecialCon .llTtl{
		padding: 20px 15px;
	}
}

/* ----- a.btnMini ----- */
#pageSpecialCon .btnWrap{
	width: 100%;
	margin-top: auto;
	padding: 0 20px 20px;
	box-sizing: border-box;
}
#pageSpecialCon .btnWrap a.btnMini{
	display: block;
	width: 100%;
}
/* SP */
@media (max-width: 1060px) {
	#pageSpecialCon .btnWrap{
		padding: 0 15px 20px;
	}
}


/* ---------------------------------------------------------------- *
	fileDls
 * ---------------------------------------------------------------- */
/* PC */
@media (min-width: 1061px) , print{
	.fileDls .etcbox{
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		-webkit-align-items: stretch;
		align-items: stretch;
		-webkit-justify-content: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		-moz-box-pack: center;
		justify-content: center;
		-ms-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		padding-top: 10px;
	}
}

.fileDls .icDl{
  text-align: center;
  padding: 30px 60px;
  display: block;
  text-decoration: none;
  color: #fff;
	margin-top: 20px;
  background-color: #27C3C8;
  position: relative;
  font-weight: 700;
	box-sizing: border-box;
}
/* PC */
@media (min-width: 1061px) , print{
	.fileDls .icDl{
		width: 48%;
  	margin-left: 1%;
  	margin-right: 1%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -moz-box-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
	}
	.fileDls .icDl_big{
		width: 100%;
		max-width: 700px;
		margin-left: 0;
		margin-right: 0;
	}
}
/* SP */
@media (max-width: 1060px) {
	.fileDls .icDl{
		width: 100%;
	}
	.fileDls .icDl:first-of-type{
		margin-top: 0;
	}
}

.fileDls .icDl::before{
  content: "";
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  margin: auto;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 25px 0 0 25px;
  border-color: transparent transparent transparent #f9b700;
  background: #efefef;
}
.etcCon.bgWh.fileDls .icDl::before{
  background: #fff;
}

.fileDls .icDl::after{
	content: "\e909";
  font-family: 'icomoon' !important;
  position: absolute;
  left: 20px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 22px;
  font-weight: 400;
  line-height: 1;
  -webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.fileDls .icDl:hover::after{
  top: 53%;
}


/* ---------------------------------------------------------------- *
	document_dl
 * ---------------------------------------------------------------- */
.document_dl{
  margin-top: 30px;
}
/* ----- document_dl_ttl ----- */
.document_dl .document_dl_ttl{
  font-size: 125%;
  font-weight: 700;
  position: relative;
  margin-top: 30px;
  padding-left: 1.2em;
}
/* SP */
@media (max-width: 1060px) {
  .document_dl .document_dl_ttl{
    margin-top: 20px;
  }
}
.document_dl .document_dl_ttl:first-child{
  margin-top: 0;
}
.document_dl .document_dl_ttl::before{
  content: "";
  display: block;
  width: 0.7em;
  height: 1em;
  background-image: url(/use_the_internet_wisely/trouble//img/document_dl_ttl.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  position: absolute;
  top: 0.25em;
  left: 0;
}

/* ----- document_dl_btnWrap ----- */
/* PC */
@media (min-width: 1061px) , print{
  .document_dl .document_dl_btnWrap{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: start;
    align-items: start;
    -webkit-justify-content: space-between;
    -webkit-box-pack: space-between;
    -ms-flex-pack: space-between;
    -moz-box-pack: space-between;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}

a.doc_dlBtn_base,
.doc_dlBtn_base{
  display: block;
  margin-top: 10px;
  width: calc(50% - 10px);
  background-color: #000;
  border-radius: 999px;
  position: relative;
  padding: 15px 44px;
  text-align: center;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0px 3px 10px 0px rgb(0 0 0 / 10%);
}
/* SP */
@media (max-width: 1060px) {
  a.doc_dlBtn_base,
  .doc_dlBtn_base{
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
  }
}

.doc_dlBtn_base::before{
  content: "\e909";
  font-family: 'icomoon' !important;
  position: absolute;
  right: 20px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 14px;
  font-weight: 400;
  line-height: 1;
  -webkit-transition-duration: 0.2s;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -ms-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.doc_dlBtn_base:hover::before {
  top: 53%;
}
.doc_dlBtn_base.doc_dlBtn_pink{background-color: #FF4D65;}
.doc_dlBtn_base.doc_dlBtn_green{background-color: #1FA580;}
.doc_dlBtn_base.doc_dlBtn_orange{background-color: #FF862A;}
.doc_dlBtn_base.doc_dlBtn_blue{background-color: #2188D6;}