@charset "utf-8";

/* THEME STYLE ------------------------------------------------------

 00. ADMIN SETTING  				管理画面投稿用の設定※消さないで※

 01. COMMON SETTINGS , HEADER

 02. KEY VISUAL

 03. NAVIGATIONS

 04. CLPG DEFAULT STYLE				wysiwygエディタデフォルトスタイル
 									.clpg-page-content スタイル以下に作成

 05. LOOP							記事一覧のスタイル

 06. FORM							お問い合わせフォーム

 07. SITEMAP						サイトマップ

 08. FOOTER							フッター

 09. MEDIAQUERY for TABLET

 10. MEDIAQUERY for BIG SP & SMALL TABLET

 11. MEDIAQUERY for SMARTPHONE

-------------------------------------------------------------------- */



/* 00. ADMIN SETTING
-------------------------------------------------------------------- */
.clpg-page-content{
	font-family:Meiryo, Verdana, Arial, sans-serif;
	word-break:break-strict;
	-webkit-text-size-adjust:100%; /* For iPhone , iPad */
}

body{
	font-size:1em!important;
}


/* 01. COMMON SETTINGS , HEADER
-------------------------------------------------------------------- */

a{
	text-decoration:none;
	color:#000;
}

header[role="banner"] .inner,
.wrapper,
footer[role="contentinfo"] .inner{
	margin:0 auto;
	width:960px;
}

.container{
  width:66%;
  padding-top:0;
}

nav.utility .utilNav li{
	margin:1em 0 0 0;
	padding:0 1em;
	background:url(../img/icon/icnArrowLed.png) no-repeat left -0.1em;
}

nav.utility li.languages{
  display:none;
}

nav.utility li.search input[type=text]{
  padding: 2px 7px;
  margin:0 0.3em;
  width: 200px;
  font-size: 0.7em;
}

input.clpg-searchbox-button{
  width:19px;
  height:20px;
  text-indent:-9999px;
  background:url(../img/icon/search.png) no-repeat center center;
  border-radius:0;
  -webkit-appearance:none;
}

input.clpg-searchbox-input{
  border-radius: 0;
  -webkit-appearance:none;
  padding: 2px 7px;
  margin: 0 0.3em;
  font-size: 0.7em;
}

nav.utility li span{
  font-size:0.7em;
  margin:0 0.8em;
}


/* 02. KEY VISUAL
-------------------------------------------------------------------- */
header[role="banner"] a{
	color:#000;
}

.toppage header[role="banner"]{
	/*background:url(../img/KVbg.jpg) no-repeat center center;*/
}

.second header[role="banner"]{
	background:url(../img/KVbg2.jpg) no-repeat left top;
	background-size:100%;
}

header[role="banner"] .KV{
	padding:2% 0 0;
	text-align:center;
}

.KV > img{
  width:100%;
	max-width:960px;
	height:auto;
}

.inner h1 img{
  max-width:352px;
  width:100%;
  height:auto;
}

/*03. NAVIGATIONS
-------------------------------------------------------------------- */
nav[role=navigation]{
  width:30%;
  margin: 0.5em 0 3em;
}

nav[role=navigation] ul.global{
  padding:1em;
	background:#eeeeee;
  border-radius:10px;
}

nav[role=navigation] ul.global li a{
	padding: 1em 0 1em 2.2em;
	color:#000;
	font-size:0.95em;
}


nav[role=navigation] ul.global a:hover{
	color:#000;
}

nav[role=navigation] ul.global > li{
	border-bottom:1px solid #d83332;
}

nav[role=navigation] ul.global > li:last-child{
  border:none;
}

nav[role=navigation] ul.global > li > a{
	background:url(../img/icon/listIcn.png) no-repeat 0.5em 1.2em;
}

nav[role=navigation] ul.global > li > a:hover,
nav[role=navigation] ul.global > li.current > a{
  background:url(../img/icon/listIcn.png) #fff no-repeat 0.5em 1.2em;
}

nav[role=navigation] ul.child > li:first-child{
	border-top:1px solid #d83332;
}

nav[role=navigation] ul.child li.current > a,
nav[role=navigation] ul.grandchild li.current > a,
nav[role=navigation] ul.child li > a:hover,
nav[role=navigation] ul.grandchild li > a:hover{
	background:url(../img/icon/icnTree.png) #fff no-repeat 2.5em 0.8em;
}

nav[role=navigation] ul.grandchild li.current > a,
nav[role=navigation] ul.grandchild li > a:hover{
  padding:0.8em 1.5em 0.8em 5.2em;
  background:url(../img/icon/icnTree.png) #fff no-repeat 3.9em 0.8em;
}

nav[role=navigation] ul.child li a{
	padding:0.8em 1.5em 0.8em 3.8em;
	background:url(../img/icon/icnTree.png) no-repeat 2.5em 0.8em;
  font-size:0.85em;
}

nav[role=navigation] ul.grandchild > li > a{
  padding:0.8em 1.5em 0.8em 5.2em;
  background:url(../img/icon/icnTree.png) no-repeat 3.9em 0.8em;
}

.bannerArea,
.snsArea{
  text-align:center;
}

nav[role=navigation] .bannerArea{
  margin:2em 0 0.5em 0;
}

nav[role=navigation] .bannerArea img{
  max-width:100%;
  height:auto;
}

nav[role=navigation] .snsArea img{
  width:100%;
  height:auto;
}

nav.breadNav{
  margin:0;
}

nav.breadNav ul li:first-child{
  margin:1em;
}

nav.utility .utilNav.spFooter{
  display:none;
}

/* 04. CLPG DEFAULT STYLE
-------------------------------------------------------------------- */
.clpg-page-content{
}

.clpg-page-content a,.breadNav a{
	text-decoration:underline;
}

.clpg-page-content a:hover,.breadNav a:hover{
  color:#d83332;
	text-decoration:underline;
}

.clpg-page-content h1.maintitle{
  margin:0.5em 0;
  padding:0.3em 0 0.2em 2.3em;
  color:#fff;
  font-size:1.2em;
  background:url(../img/icon/h2Icn.png) #d83332 no-repeat 1em 0.5em;
  background-size:18px 18px;
  border-radius:7px;
  border:none;
}

.clpg-page-content h2.maintitle,
.clpg-page-content h2{
  margin:1em 0 0.5em;
  padding:0.2em 0 0.2em 0.7em;
  font-size:1.2em;
  border-bottom:4px solid #d83332;
}

.clpg-page-content h3{
  margin:1em 0 0.5em;
  padding:0.2em 0 0.2em 0.7em;
  font-size:1.1em;
  border-bottom:4px solid #a9a9a9;
}

.clpg-page-content h4{
  margin:1em 0 0.5em;
  padding:0.2em 0 0.2em 0.7em;
  font-size:1.1em;
  border-bottom:1px dotted #a9a9a9;
}

.clpg-page-content h5{
	margin:1.5em 0 0.5em;
  padding:0.2em 0 0.2em 0.7em;
	font-size:1.1em;
	font-weight:bold;
  color:#d83332;
}

.clpg-page-content h6{
	margin:1.5em 0 0.5em;
  padding-left:0.7em;
  font-size:1em;
	font-weight:bold;
}

.clpg-page-content p.title{
  font-size:1em;
}

.clpg-page-content p{
	margin:0.5em 0;
	font-size:0.95em;
	line-height:160%;
}

.clpg-page-content table,
.clpg-page-content th,
.clpg-page-content td{
	border-collapse:collapse;
}

.clpg-page-content table{
	margin:1em auto 0.5em;
	font-size:0.95em;
}

.clpg-page-content th,
.clpg-page-content td{
	padding:0.5em;
	border:1px solid #CCC;
	text-align:left;
}


.clpg-page-content th{
	border:1px solid #CCC;
	background:#FAFAFA;
	text-align:left;
}


.clpg-page-content ul,
.clpg-page-content ol{
	margin:0.5em 0 0 1em;
	font-size:0.95em;
}

.clpg-page-content ul li,
.clpg-page-content ol li{
	margin:0.3em 0;
}

.clpg-page-content ul li{
	padding-left:0.8em;
	background:url(../img/icon/icnArrowLed.png) no-repeat left 0.2em;
}

.clpg-page-content ol li{
	margin-left:0.8em;
	list-style:decimal;
}

.clpg-page-content dl{
  border-bottom: 1px dashed #d83332;
  padding:0.5em 0;
}

.clpg-page-content dl dt{
  margin:0;
  float: none;
  padding:0.8em 0 0.5em 0;
  border-bottom: none;
  background: none;
}

.clpg-page-content dl dd{
  margin-left:2em;
  float: none;
  padding:0.5em 0 0.5em 0;
  border: none;
  background: none;
}

.clpg-page-content dt img{
  vertical-align:top;
  margin-right:0.7em;
}

.clpg-page-content .aboutPurpose-detail{
  background:#ffe6e6;
}

.clpg-page-content .aboutPurpose-detail p{
  padding: 0.8em 0 0.8em 0;
  margin: 0 0.8em;
}

/* 05. LOOP
-------------------------------------------------------------------- */
.clpg-entry-container{
  padding:1em;
  border-radius:10px;
  border:solid 3px #aaaaaa;
}

h2.maintitle + article.loop{
	margin-top:-0.5em;
}

article.loop{
	padding:1em 0;
	clear:both;
	border-bottom:2px dotted #DDD;
}

article.loop:first-child{
  padding-top:0;
}

article.loop:last-child{
  padding-bottom:0;
	border-bottom:none;
}

article.loop:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
* html article.loop             { zoom: 1; }
*:first-child+html article.loop { zoom: 1; }

article.loop figure{
	margin:0 1em 0 0;
	float:left;
}

.clpg-entry-container article.loop h3{
	margin:0;
	font-size:1em;
	border-bottom:none;
}

article.loop h3 time{
	display:inline-block;
	*display:inline;
	*zoom:1;
	margin-right:1em;
	font-size:0.8em;
}

.clpg-entry-container article.loop h3 a,
.clpg-page-content h2 > a{
  padding-left:0.8em;
  background:url(../img/icon/icnArrowLed.png) no-repeat left 0.4em;
}

.time time{
  margin-right:2em;
}

p.list{
  text-align:right;
}

p.list a{
  padding-left:1.5em;
  background:url(../img/icon/icnArrowLed_2.png) no-repeat left 0.2em;
}

.clpg-search-container article.loop h3{
	margin:0;
	font-size:1em;
	border-bottom:none;
}

/* 06. FORM
-------------------------------------------------------------------- */

.clpg-form-container .require{
	color:#AC1618;
	font-size:0.8em;
}

.clpg-form-container table{
	width:100%;
}

.clpg-form-container table p{
	font-size:1em;
}

.clpg-form-container table th{
	background:#DDD;
}

.clpg-form-container p.caution{
	padding-left:20px;
	color:#AC1618;
	font-weight:bold;
	background:url(../img/icon/errIcon.png) no-repeat left 0.2em;
}

.clpg-form-container .input-err{
	background:#FFCFCF;
}

.clpg-form-container .buttonContainer{
	text-align:center;
}

.clpg-form-container .buttonContainer input{
	cursor:pointer;
	display:inline;
}

.clpg-form-container input.button{
	margin:1em 0;
	padding:0.5em;
	border-radius: 4px;
	box-shadow: 0px 0px 2px 0px rgba(255, 255, 255, 0.5) inset;
	background: #109DDD;
	border: 1px solid #666;
	color: #FFF;
	font-size: 1em;
	font-weight: bold;
	width:10em;
}

.clpg-form-container .button.back{
	background: #333;
}

.clpg-form-container .button a{
	padding:0.8em;
	display:block;
	color:#FFF;
	text-align:center;
}

.clpg-form-container .button a:hover{
	background:#264155;
}

.clpg-form-container .button.back a:hover{
	background: #111;
}


/* 07. SITEMAP
-------------------------------------------------------------------- */
ul.clpg-sitemap-container{
	margin:0;
}

ul.clpg-sitemap-container *{
	font-size:1em;
}

ul.clpg-sitemap-container > li{
	margin-bottom:1.5em;
}

ul.clpg-sitemap-container li ul{
	margin:0.5em 0;
}

ul.clpg-sitemap-container li ul > li{
	margin-bottom:0.8em;
	padding:0 0 0 1.8em;
	background:url(../img/icnTree.png) no-repeat left -2px;
}

ul.clpg-sitemap-container li ul li ul li{
	margin-bottom:0.5em;
	padding:0 0 0 1.8em;
	background:url(../img/icnTree.png) no-repeat left -2px;
}




/* 08. FOOTER
-------------------------------------------------------------------- */
footer[role=contentinfo]{
	background:#fff;
  border-top:solid 5px #d83332;
}

footer[role=contentinfo] p.copyright{
	color:#000;
	font-size:0.7em;
  text-align:right;
}

footer[role=contentinfo] nav.utility .utilNav li{
  margin: 1em 0 0 0;
  padding: 0 2.2em 0 1.5em;
  background: url(../img/icon/icnArrowLed_2.png) no-repeat left 0.1em;
  line-height: 1.5em;
}

nav.utility .utilNav.footer{
  padding-bottom:0;
}


/* 09. MEDIAQUERY for TABLET
-------------------------------------------------------------------- */
@media screen and (min-width: 768px) and (max-width: 1024px) {

	header[role="banner"] .inner,
	.wrapper,
	footer[role="contentinfo"] .inner{
		margin:0 auto;
		width:96%;
	}
}


/* 10. MEDIAQUERY for BIG SP SMALL TABLET
-------------------------------------------------------------------- */
@media screen and (min-width: 481px) and (max-width: 767px) {

		header[role="banner"] .inner,
		.wrapper,
		footer[role="contentinfo"] .inner{
			margin:0 auto;
			width:96%;
		}

		header[role="banner"] .KV{
			padding:20px 0;
		}

		nav[role=navigation] ul.global li a{
			font-size:0.8em;
		}

		article.loop figure{
			display:block;
			width:100%;
			text-align:center;
		}

    nav.utility li.search input[type=text]{
      width:150px;
    }

    header[role=banner] .inner h1{
      width:40.5%;
      }

    header[role=banner] .inner nav{
      width:59.5%;
    }

}


/* 11. MEDIAQUERY for SMARTPHONE
-------------------------------------------------------------------- */
@media screen and (max-width: 480px) {

		header[role="banner"] .inner,
		.wrapper,
		footer[role="contentinfo"] .inner{
			margin:0 auto;
			width:100%;
		}

		ul.spHeader{
			background:#fff;
		}

    .spHeader .language{
      display:none;
    }

    ul.spHeader li.search{
      width: 80%;
    }

    header[role=banner] .inner h1 img{
      width: 100%;
    }

		header[role="banner"] .inner{
			background:#fff;
			text-align:center;
		}

		.toppage header[role="banner"]{
			background-position:left -80px;
			background-size:160% auto;
		}

    nav[role=navigation]{
      width:100%;
      top:42px;
      right:0;
    }

    nav[role=navigation] ul.global{
      border-radius:0;
    }

		nav.breadNav{
			margin:0;
		}

    .container{
      width:90%;
    }

    footer[role=contentinfo] .bannerArea,
    footer[role=contentinfo] .snsArea{
      padding:0 1em;
      list-style:none;
    }

    footer[role=contentinfo] .bannerArea img,
    footer[role=contentinfo] .snsArea img{
      max-width:100%;
    }

    footer[role=contentinfo] p.copyright{
      text-align:center;
    }

    nav.utility li.totop img{
      width:60px;
    }

    ul.spHeader li.spmenu{
      top:12px;
    }

    .spHeader .search li:nth-child(2){
      width:80%;
    }

    nav.utility .utilNav.spFooter{
      display:block;
    }


}