@charaset "UTF-8";

/***** 全体 *****/

.container {
	background-image: none;
	}
.contents {
	width: 100%;
	float: none;
	}

/*****　イントロ　*****/

#home {
	margin-top:50px;
}

section.summary  {
	margin-bottom: 20px;
	}

.title-img {
	display: none;
	}
.home-title {
	height: 300px;
	display: table-cell;
	vertical-align: middle;
	}
h1 {
	font-size: 500%;
	height: auto;
	width: auto;
	padding: 0;
	margin: 0;
	}
.title-catch01 {
	font-size: 250%;
	font-weight: bold;
	margin-bottom: 0.7em;
	}
.title-catch02 {
	font-size: 200%;
	font-weight: bold;
	text-align: center;
	color: #fff;
	display: block;
	width: 425px;
	background-color: #38afff;
	padding: 0.5em 0  0.4em 0;
	margin-bottom: 0.7em;
	
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	}
h1,
.title-catch01,
p.pop {
	color: #153b8a;
	}
	
.summary {
	background-image: url(../images/home/main.png);
	background-repeat: no-repeat;
	background-size: 62%;
	background-position: 107% 80px;
	}

.summary p {
	font-size: 120%;
	line-height: 160%;
	width: 500px;
	text-shadow: 0 0 5px #fff;
	text-shadow: #fff 1px 1px 5px, #fff -1px 1px 5px, #fff 1px -1px 5px, #fff -1px -1px 5px;
	/*background-color: rgba(0,0,0,0.1);*/
	}
.summary .photo {
	width: 500px;
	margin-bottom: 20px;
	}
.summary .photo img {
	float: left;
	margin-right: 20px;
	}
.summary .photo p {
	width: 100%;
	}
.summary li {
	font-size: 140%;
	/*font-weight: bold;*/
	color: #0896fb;
	background-image: url(../images/header_question.png);
	background-repeat: no-repeat;
	background-position: left 2px;
	background-size: 20px;
	padding-left: 25px;
	margin-bottom: 0.4em;
	}
.summary li:last-child {
	margin-bottom: 0;
	}
.question {
	background-color: #fdfdab;
	background-color: rgba(255,255,104,0.4);
	padding: 20px;
	margin-bottom: 20px;
	
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	}
.question figure {
	width: 20%;
	float: left;
	}
.question ul {
	margin-left: 22%;
	}

.solution {
	text-align: center;
	background-image: url(../images/home/arrow.png);
	background-position: 97% bottom;
	background-repeat: no-repeat;
	background-size: 85px;
	padding-bottom: 30px;
	margin-bottom: 40px;
	}
.solution p.pop {
	width: 100%;
	font-size: 370%;
	font-weight: bold;
	line-height: 120%;
	margin-bottom: 20px;
	}
.solution p.pop span{
	font-size: 150%;
	}

/*****　各カテゴリー　*****/

.category {
	/*margin-top: 30px;*/
	}
.category-title  {
	padding-bottom: 20px;
	margin-bottom: 20px;
	
	-moz-border-radius: 0 0 8px 8px;
	-webkit-border-radius: 0 0 8px 8px;
	border-radius: 0 0 8px 8px;
	}
.category-title h2 {
	font-size: 340%;
	margin-bottom: 10px;
	
	background-color: rgba(0,0,0,0)
	}
.category-title p {
	font-size: 140%;
	margin-bottom: 0;
	}
.category-title h2,
.category-title p {
	color: #fff;
	line-height: 140%;
	padding: 0 20px;
	}
	
.category .case {
	display: block;
	border-bottom: dotted 1px #ccc;
	padding-bottom: 20px;
	margin-bottom: 20px;
	}
.category .list-catch {
	margin-bottom: 20px;
	}

		
.list-manner {
	background-color: #924c68;
	}
.list-livinginfo {
	background-color: #6683ae;
	}
.list-trivias {
	background-color: #829951;
	}

/*****　項目一覧　*****/

article.detail-manner {
	background-color: #faf3f3;
	border: solid 2px #ab5c7c;
	}
article.detail-livinginfo {
	background-color: #f3f5f8;
	border: solid 2px #6683ae;
	}
article.detail-trivias {
	background-color: #f9fcf2;
	border: solid 2px #829951;
	}
	
article {
	border: solid 2px #ccc;
	padding: 20px 20px 0 20px;
	
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	}
h3 {
	font-size: 105%;
	}
h3.no-list,
ul.home-list {
	border-bottom: dotted 1px #ccc;
	border-bottom : dotted 1px rgba(0,0,0,0.2);
	padding-bottom: 7px;
	margin-bottom: 7px;
	}
h3.no-list:last-child,
ul.home-list:last-child {
	border-bottom: none;
	padding-bottom: 20px;
	}
h3,
h3.no-list,
.home-list li {
	line-height: 22px;
	}
.home-list li {
	display: block;
	float: left;
	width: 20%;
	}
h3.no-list a,
.home-list li a {
	display: block;
	background-image:url(../images/arrow01_home.png);
	background-repeat: no-repeat;
	background-position: right center;
	}
h3.no-list a {
	color: #333;
	width: 20%;
	padding-left: 0;
	}
.home-list li a {
	color: #666;
	opacity: 1;
	font-size: 100%;
	padding-left: 10px;
	}
h3.no-list a:hover,
.home-list li a:hover {
	color: #333;
	background-color:#fdffa4;
	}

.list-row h3 {
	width:32%;
	float: left;
	}
.list-row h3 {
	margin-right: 2%;
	}
.list-row h3:nth-child(3),
.list-row h3:nth-child(6),
.list-row h3:nth-child(9),
.list-row h3:nth-child(12) {
	margin-right: 0;
	}
.list-row h3.no-list a {
	width: 80%;
	}
.list-row h3.no-list:last-child {
	border-bottom: dotted 1px #ccc;
	border-bottom : dotted 1px rgba(0,0,0,0.2);
	padding-bottom: 7px;
	margin-bottom: 7px;
	}


.home-list.prefecture li {
	width: 10%;
	}


/*　項目カテゴリーのみ　*/

ul.home-list.category-only {
	border-bottom: none;
	}
.home-list.category-only li {
	display: block;
	float: left;
	width: 33.333%;
	border-bottom: dotted  1px rgba(0,0,0,0.2)
	}
.home-list.category-only li a {
	color: #333;
	opacity: 1;
	font-size: 110%;
	font-weight: bold;
	line-height: 40px;
	padding-left: 3%;
	
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	}
.home-list.category-only span {
	color: #666;
	font-size: 90%;
	font-weight: normal;
	display: block;
	float: right;
	width: 25px;
	text-align: right;
	position: relative;
	right: 30px;
	}
.child-number {
	font-size: 90%;
	color: #666;
	padding-bottom: 20px;
	}




.grid-4 {
	float: left;
	margin-left: 3%;
	}
.grid-4 {
	width: 22.75%;
	}
	
.grid-2:first-child,
.grid-3:first-child,
.grid-4:first-child {
	margin-left: 0;
	}

.frame {
	-webkit-box-shadow: 0 0 1px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 0 1px rgba(0,0,0,0.5);
	box-shadow: 0 0 1px rgba(0,0,0,0.5)
	}


/*****　アプリ紹介　*****/

.about-appendix {
	width:100%;
	}
	
figure.app-img {
	float: right;
	text-align: right;
	margin: 60px 40px 10px 20px;
	}
.appendix-title {
	background-color: #2150a8;
	 padding: 20px;
	 margin-bottom: 20px;
	}
.appendix-title h3 {
	color: #fff;
	font-size: 300%;
	padding: 0;
	margin: 0 0 15px 0;
	}
.about-appendix.home p.btn {
	font-size: 220%;
	font-weight: bold;
	line-height: 130%;
	margin: 0;
	}
.about-appendix.home .btn a {
	display: block;
	background-color: #ff9900;
	color: #fff;
	background-image: url(../topics/images/light.png);
	width: 500px;
	padding: 20px;
	margin: 0;

	-moz-border-radius: 16px;
	-webkit-border-radius: 16px;
	border-radius: 16px;
	}
.about-appendix.home .btn a:hover {
	color: #2150a8;
	background-color: #F8EC4C;
	opacity: 1;
	}
.about-appendix.home .btn a img {
	float: left;
	width: 80px;
	margin-right: 10px;
	}


/*****　ストアバナー　*****/

.store-banner {
	/*border: solid 1px #ccc;*/
	
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	}



.away600 {
	display: inline;
	}
.appear600 {
	display: none;
	}


@media (min-width: 1024px) {	

/*　ストアアイコン　*/
.banner-row {
	background-position: 18.5% 0;
	background-size: 12%;
	}
.banner-row img {
	width: 50%;
	}

}


/*****　スマホ・タブレットでの非表示対応　*****/

@media (max-width: 1024px) {

section,
h1
/*.ad-header,*/
/*.ad-bottom*/ {
	display: block;
	}
header,
footer,
.contents  {
	width: 96%;
	margin-left: auto;
	margin-right: auto;
	}
section {
	width: 100%;
	}
.contents {
	float: none;
	}


/*****　各カテゴリー　*****/

	
/*****　項目一覧　*****/
article {
	padding: 2%;
	padding-bottom: 0;
	}
h3.no-list a,
.home-list li {
	/*line-height: 18px;*/
	width: 33.33%;
	overflow: hidden;
	}
	
.list-row h3.no-list a {
	width: 100%;
	}

.home-list.prefecture li {
	width: 16.66%;
	}


/*****　アプリ紹介　*****/

figure.app-img {
	margin: 20px;
	width: 280px;
	}
figure.app-img img {
	width: 280px;
	}
.appendix-title {
	 padding: 20px;
	}
.appendix-title h3 {
	display: block;
	font-size: 220%;
	}
.about-appendix.home p.btn {
	font-size: 200%;
	}
.about-appendix.home .btn a {
	width: 430px;
	height: 70px;
	padding: 10px;
	}
.about-appendix.home .btn a img {
	width: 70px;
	}


}


@media (max-width: 768px) {
	
/*****　イントロ　*****/

.home-title {
	height: 250px;
	}
h1 {
	font-size: 350%;
	}
.title-catch01 {
	font-size: 175%;
	}
.title-catch02 {
	font-size: 150%;
	width: 295px;
	}

.summary {
	background-size: 64%;
	background-position: 108% 60px;
	}
.summary p {
	font-size: 110%;
	width: 370px;
	}
.summary .photo img {
	width: 120px;
	}
.summary .photo {
	width: 100%;
	}
.summary li {
	font-size: 120%;
	margin-bottom: 0.2em;
	}
.question {
	padding: 10px;
	}

.solution {
	background-position: 100% bottom;
	background-size: 60px;
	padding-bottom: 30px;
	margin-bottom: 30px;
	}
.solution p.pop {
	font-size: 280%;
	}
.solution p.pop span{
	font-size: 140%;
	}


/*****　各カテゴリー　*****/

.category-title {
	margin-top: 20px;
	}
.category-title h2 {
	font-size: 260%;
	}
.category-title p {
	font-size: 120%;
	}
.category-title h2,
.category-title p {
	padding: 0 20px;
	}


/*　項目カテゴリーのみ　*/

.home-list.category-only li {
	width: 50%;
	}
.child-number {
	font-size: 90%;
	padding-bottom: 10px;
	}	

/*****　アプリ紹介　*****/

figure.app-img {
	margin: 20px 20px 20px 20px;
	width: 250px;
	}
figure.app-img img {
	width: 250px;
	}
.appendix-title {
	 padding: 20px;
	}
.appendix-title h3 {
	font-size: 180%;
	}
.about-appendix.home p.btn {
	font-size: 180%;
	}
.about-appendix.home .btn a {
	width: 390px;
	height: 60px;
	}
.about-appendix.home .btn a img {
	width: 60px;
	}


}


@media (max-width: 680px) {

/*****　アプリ紹介　*****/

figure.app-img {
	width: 200px;
	margin: 20px 20px 20px 20px;
	}
figure.app-img img {
	width: 200px;
	}
.appendix-title {
	 padding:  20px;
	}
.about-appendix.home p.btn {
	font-size: 150%;
	}
.about-appendix.home .btn a {
	width: 350px;
	height: 60px;
	}
.about-appendix.home .btn a img {
	width: 60px;
	}

}


/*****　スマホ・タブレットでの非表示対応　*****/

@media (max-width: 600px) {


/*****　イントロ　*****/

.home-title {
	height: 220px;
	}
h1 {
	font-size: 300%;
	}
.title-catch01 {
	font-size: 150%;
	}
.title-catch02 {
	font-size: 140%;
	width: 255px;
	}

.summary {
	background-size: 58%;
	background-position: 108% 35px;
	}
.summary p {
	font-size: 100%;
	width: 100%;
	}
.summary li {
	font-size: 110%;
	margin-bottom: 0.1em;
	}

.solution {
	background-position: 100% bottom;
	background-size: 60px;
	padding-bottom: 30px;
	margin-bottom: 30px;
	}
.solution p.pop {
	font-size: 230%;
	}
.solution p.pop span{
	font-size: 130%;
	}


/*****　各カテゴリー　*****/

.category-title p {
	font-size: 100%;
	}
.category-title h2,
.category-title p {
	padding: 0 15px;
	}

/*****　項目一覧　*****/

h3.no-list a,
.home-list li {
	width: 50%;
	}

.list-row h3 {
	width:49%;
	float: left;
	}
.list-row h3 {
	margin-right: 0;
	}
.list-row h3:nth-child(odd) {
	margin-right: 2%;
	}
.list-row h3.no-list a {
	width: 100%;
	}	
	
.home-list.prefecture li {
	width: 16.66%;
	}
	

.away600 {
	display: none;
	}
.appear600 {
	display: inline;
	}


/*****　アプリ紹介　*****/

figure.app-img {
	width: 200px;
	margin: 0 20px 20px 20px;
	}
figure.app-img img {
	width: 200px;
	}
.appendix-title {
	 padding:  20px;
	}
.about-appendix.home p.btn {
	font-size: 150%;
	}
.about-appendix.home .btn a {
	width: 96%;
	height: 60px;
	}
.about-appendix.home .btn a img {
	width: 60px;
	}


}

/*****　スマホ・タブレットでの非表示対応　*****/

@media (max-width: 480px) {


/*****　イントロ　*****/

.title-img {
	display: block;
	margin-top: 70px ;
	}
.home-title {
	height: auto;
	display: block;
	text-align: center;
	 margin: 20px auto;
	}
h1 {
	font-size: 300%;
	}
.title-catch01 {
	font-size: 150%;
	}
.title-catch02 {
	font-size: 130%;
	width: 250px;
	margin-left: auto;
	margin-right: auto;
	}

.summary {
	background-image: none;
	}
.summary p {
	width: 100%;
	}
.summary li {
	font-size: 100%;
	}

.solution {
	background-image: none;
	padding-bottom: 0;
	margin-bottom: 0;
	}
.solution p.pop {
	font-size: 190%;
	}


/*****　各カテゴリー　*****/

.category-title  {
	padding: 15px;
	margin-bottom: 10px;
	
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	}
.category-title h2 {
	font-size: 220%;
	}
.category-title h2,
.category-title p {
	padding: 0;
	}

.category .case {
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 15px;
	}
.category .case li {
	list-style: disc;
	}
.category .list-catch {
	margin-bottom: 10px;
	}


/*****　項目一覧　*****/

.home-list li {
	width: 50%;
	font-size: 90%;
	}
.home-list.prefecture li {
	width: 20%;
	}
.home-list li a {
	padding-left: 0;
	}
	
h3,
.no-child li a {
	font-size: 100%;
	}


/*****　アプリ紹介　*****/

figure.app-img {
	float: none;
	margin: 0;
	}
figure.app-img img {
	margin-bottom: 20px;
	}

}


/*****　スマホ・タブレットでの非表示対応　*****/

@media (max-width: 380px) {

header,
footer,
.contents  {
	width: 94%;
	}


/*****　イントロ　*****/

h1 {
	font-size: 260%;
	}
.title-catch01 {
	font-size: 130%;
	}
.title-catch02 {
	font-size: 130%;
	width: 220px;
	}

.summary .photo img {
	width: 100px;
	margin-right: 10px;
	}
	
.summary li {
	background-size: 15px;
	padding-left: 20px;
	background-position: 0 4px;
	}
.question figure {
	display: none;
	}
.question ul {
	margin-left: 0;
	}

.solution p.pop {
	font-size: 150%;
	}

/*****　各カテゴリー　*****/

.category-title  {
	padding: 10px;
	}
.category-title h2 {
	font-size: 160%;
	}
	
/*****　項目一覧　*****/

.list-row h3 {
	width:100%;
	float: none;
	}
.list-row h3:nth-child(odd) {
	margin-right: 0;
	}
.list-row h3.no-list a {
	width: 100%;
	}

.home-list.prefecture li {
	width: 25%;
	}


/*　項目カテゴリーのみ　*/

.home-list.category-only li {
	width: 100%;
	}
.home-list.category-only li a {
	line-height: 34px;
	}


/*****　アプリ紹介　*****/

.appendix-title {
	 padding:  10px;
	}
.appendix-title h3 {
	font-size: 150%;
	margin: 0;
	}
.about-appendix.home p.btn {
	font-size: 120%;
	}
.about-appendix.home .btn a {
	width: 94%;
	height: 50px;
	}
.about-appendix.home .btn a img {
	width: 50px;
	}

}

/*****　スマホ・タブレットでの非表示対応　*****/

@media (max-width: 320px) {

/*****　イントロ　*****/
	
.summary li {
	background-size: 15px;
	padding-left: 18px;
	}
.question {
	padding: 10px 5px;
	}
.question figure {
	display: none;
	}
.question ul {
	margin-left: 0;
	}

.solution p.pop {
	font-size: 140%;
	}


h3.no-list a,
.home-list li {
	width: 100%;
	}
.home-list.prefecture li {
	width: 33.333%;
	}


/*****　アプリ紹介　*****/

.about-appendix.home p.btn {
	font-size: 110%;
	}
.about-appendix.home .btn a {
	width: 93%;
	height: 40px;
	}
.about-appendix.home .btn a img {
	width: 40px;
	}



}