@charset "UTF-8";
/*
Theme Name: MY THEME (Chapter 8-C1)
Author: TRAVEL SKETCH
Description: This is my original theme.
Version: 1.0
*/


/*要素のフォントサイズやマージン・パディングをリセットしています*/
html, body, div, span, object, iframe,
blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
}
 

body{margin: 0;
color:#666666;
font-family: Arial, Roboto, "Droid Sans", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;}

.container{max-width: 650px;
margin-left: auto;
margin-right: auto;
padding:15px}

.container img{
border: none;
max-width: 100%;
height: auto}


.containerback1{width:100%;
height:auto;
background-color:#FDF1E5;}

.containerback2{
color:#fff;
background-color:#DDDBD5;
background: url('img/deaiseting.jpg')0 0 no-repeat;
background-size:cover;
}

/* 文字関連 */

.cdai{
font-size:25px;
}

.csyou{
font-size:14px;
}




/* 記事 */
article{margin-bottom: 40px;
overflow: hidden}

article h1{margin: 0;
font-size: 32px;
font-weight: normal}

article h1 a{color: #000000;
text-decoration: none}


/* 記事の付加情報 */
.postinfo{margin-top: 15px;
font-size: 14px}

.postinfo a{color: #000000;
text-decoration: none}

.postinfo .postcat{margin-left: 20px}

.postinfo .postcom{margin-left: 20px}

.postinfo i{color: #888888}


/* 前後の記事へのリンク */
.pagenav a{padding: 5px 10px;
border: solid 1px #cccccc;
border-radius: 10px;
color: #666666;
font-size: 12px;
text-decoration: none}

.pagenav .old a{float: left}

.pagenav .new a{float: right}

.pagenav{overflow: hidden;
margin-top: 40px;
margin-bottom: 40px;
clear: both}


/* ヘッダー */

header{margin-bottom: 40px;
margin-top:0;
background-color: #333333;
color: #ffffff}


header a{color: #ffffff;
text-decoration: none}

header h1{
font-size:10px;
}


#info strong {
font-size: 28px;
color: #CDA63D;
font-family: Arial, Helvetica, sans-serif;
}
#info span {
font-size: 18px;
color: #666666;
}

.siteinfo{overflow: hidden;
margin-top:0;
padding-top: 5px;
background-color: #ffffff;
color: #4a5f7e}

.conteinerhidari{
float:left;
margin:0;
}

.coteinermannaka{
float:left;
margin:0 0 0 100px;
}

#info {
float: right;
top: 25px;
}


@media (max-width: 768px) {

.conteinerhidari{
width:40%;
float:left;
margin:0;
}

.coteinermannaka{
width:50%;
float:right;
margin:0;
}

#info {
clear:both;
width:100%;
float: none;
}

#info img {
display: block;
width:90%;
margin:50px auto 0 auto;
}
}

@media (max-width: 480px) {
	
	#info img{
		max-width:272px;
		padding-top:10px;
	}

.conteinerhidari{
width:33%;
float:left;
margin:0;
}

.coteinermannaka{
width:55%;
float:right;
margin:0;
}

#info {
float: none;
top: 25px;
}


}




/* ヘッダー画像 */
header img{width: 100%;
height: auto;
vertical-align: bottom}


/* ナビゲーションメニュー */
nav ul{list-style: none;
background-color: #333333;
margin: 0;
padding: 0 0 0 200px;
font-size: 12px;
overflow: hidden}

nav li{float: left;
margin-right: 15px}

nav li a{display: block;
padding-top: 15px;
padding-bottom: 10px;
border-bottom: solid 5px transparent}

nav li a:hover{border-bottom-color: #00ccff}

nav li.current-menu-item a
{border-bottom-color: #e6cc1c}


.gazobox{
/* boxレイアウトの指定 */
display: box;
display: -webkit-box;
display: -moz-box;
display:-ms-flexbox;

/* 配置したボックスを左右中央寄せにする */
box-pack: center;
-webkit-box-pack: center;
-moz-box-pack: center;

border: 1px solid #ccc;
border-radius: 5px;
padding:0 50px 0 0;
margin-bottom:15px;
}
.boxCh1 {
-moz-box-flex:1;
width: 30%;
height: auto;
margin: 10px;
}

.boxCh2 {
-moz-box-flex:1;
width: 70%;
height: auto;
font-size: 13px;
color: #444;
margin: 10px;
}
.boxCh2 h4{
border-bottom: 3px solid #ccc;
font-size:16px;
margin-bottom:0;
}

.boxtop{
float:left;
width:390px;
margin:0 45px;
}

.boxtop img{
display: block;
margin:auto;
}

.boxtop h3{
text-align:center;
background-color:#EB6100;
font-size:28px;
padding:3px 0;
border-bottom: 1px solid #666;
}



.boxtop h4{
font-size:20px;
color:#FFF;
border-bottom: 1px solid #666;
margin:0;
}

.button{
font-size:20px;
color:#FFF;
padding:10px 12px;
background-color:#666666;
text-align:center;
text-decoration:none;
}

.button a{
color:#FFF;
}

.boxtop1{
float:left;
margin:0 10px;
width:320px;
}

.boxtop2{
float:left;
margin:0 10px;
width:600px;
}

@media (max-width: 768px) {

.boxtop{
float:none;
width:auto;
margin:0 10px;
}


.boxtop1{
float:none;
margin:0 10px;
width:auto;
}

.boxtop2{
width:auto;
float:none;
margin:10px 0 0 0;
}


}




table { border:1px solid #ccc; border-collapse: collapse; border-spacing: 0; margin: 20px auto; width: 100%;}
th {background:#666666;border:1px solid #999;padding:10px; width:36%; color:#FFF;}
td {border:1px solid #999;padding:10px; width:32%;}

@media screen and (max-width: 768px) {
    .table-sp,
    .table-sp tbody,
    .table-sp thead,
    .table-sp tr,
    .table-sp td,
    .table-sp th {display:block;}
 
    .table-sp th {width:auto;}
    .table-sp td {width:auto;}
}


 


h1.headding05 {
margin:0 0 30px 0;
padding:12px 10px;
background: #1d8ade; /* Old browsers */
background: -moz-linear-gradient(left, #1d8ade 0%, #53a2e2 50%, #1d8ade 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#1d8ade), color-stop(50%,#53a2e2), color-stop(100%,#1d8ade)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left, #1d8ade 0%,#53a2e2 50%,#1d8ade 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left, #1d8ade 0%,#53a2e2 50%,#1d8ade 100%); /* Opera11.10+ */
background: -ms-linear-gradient(left, #1d8ade 0%,#53a2e2 50%,#1d8ade 100%); /* IE10+ */
background: linear-gradient(left, #1d8ade 0%,#53a2e2 50%,#1d8ade 100%); /* W3C */
color:#FFF;
text-shadow:1px 1px 2px #333;
box-shadow:0 2px 3px rgba(0, 0, 0, 0.4) , inset 0 0 50px rgba(0, 0, 0, 0.1) ;
position:relative;
font-size:18px;
}
 
h1.headding05:before,
h1.headding05:after{
content: ' ';
position: absolute;
z-index: -1;
width: 40%;
height: 20px;
left: 4px;
bottom:7px;
-webkit-box-shadow: 0 8px 15px rgba(0,0,0, 0.7);
-moz-box-shadow: 0 8px 15px rgba(0, 0, 0, 0.7);
box-shadow: 0 8px 15px rgba(0, 0, 0, 0.7);
background-color: #F00;
-webkit-transform: rotate(-3deg);
-moz-transform: rotate(-3deg);
-o-transform: rotate(-3deg);
-ms-transform: rotate(-3deg);
transform: rotate(-3deg);
}
h1.headding05:after{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}


h2{
padding-bottom: .5em;
color: #FFF;
font-size:30px;
font-weight:normal;
border-bottom: 3px solid #EEE8AA;
}

h2.siro{
padding-bottom: .5em;
color: #333;
font-size:30px;
font-weight:normal;
border-bottom: 3px solid #EEE8AA;
}

h2.siro span {
display: block;
margin-bottom: .2em;
color: #000;
font-size: 20px;
}

h2 span {
display: block;
margin-bottom: .2em;
color: #FFF;
font-size: 20px;
}

/* フッター */
footer{margin-top: 40px;
padding-top: 14px;
padding-bottom: 14px;
background-color: #EB6100;
color: #ffffff}

.boxfooter{
padding:0 10px;
float:left;
font-size:12px;
width:310px;
height:100px;
border-right: 1px solid #5E81B4;
}

.boxfooter:first-child{
border-left: 1px solid #5E81B4;
}

.boxfooter i{
padding:10px;
background-color: #031C4A;
}

@media (max-width: 768px) {

.boxfooter{
padding:0 10px;
float:left;
font-size:12px;
width:25%;
border-right: 1px solid #5E81B4;
}

.boxfooter img{
max-width: 100%;
height: auto;
}

.boxfooter:first-child{
border-left: 1px solid #5E81B4;
}

}

@media (max-width: 480px) {

.boxfooter{
padding:0 10px;
float:none;
font-size:12px;
width:auto;
border:none;
}

.boxfooter:first-child{
border-left:none;
}

}

small{
display:block;
margin-top:10px;
font-size:10px;
}


/* 本文中の画像 */
article img{border: none;
max-width: 100%;
height: auto}

.aligncenter{display: block;
margin-top: 30px;
margin-bottom: 30px;
margin-left: auto;
margin-right: auto}

.alignright{float: right;
margin-bottom: 30px;
margin-left: 30px}

.alignleft{float: left;
margin-bottom: 30px;
margin-right: 30px}

.wp-caption{max-width: 100%}

.wp-caption-text{margin: 0;
color: #666666;
font-size: 14px;
text-align: center}


/* メニュー */
.blogmenu ul{margin: 0;
padding: 0;
list-style: none}

.blogmenu .widget{margin-bottom: 30px;
padding: 20px;
background-color: #e8e8e8}

.blogmenu .widgettitle{margin-top: 10px;
margin-bottom: 20px;
border-right: solid 10px #4a5f7e;
border-bottom: solid 1px #4a5f7e;
color: #4a5f7e;
font-size: 14px}

.blogmenu li a{display: block;
padding: 10px 5px;
color: #666666;
font-size: 14px;
text-decoration: none}

.blogmenu li a:hover{background-color: #ffffff}

.blogmenu img{
width:300px;
}




/* 見出し */
.archive-title{margin-top: 0;
margin-bottom: 40px;
background-color: #eeeeee;
font-size: 14px;
font-weight: normal}

.archive-title i{padding: 15px;
background-color: #4a5f7e;
color: #ffffff}


/* コメント投稿フォーム */
#respond p{margin-top: 0;
margin-bottom: 20px;
font-size: 12px}

#respond label{font-size: 14px}

#respond input,
#respond textarea{width: 100%;
padding: 5px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box}

#respond input[type="submit"]
{width: 200px;
padding: 10px;
border: none;
background-color: #e6cc1c;
-webkit-appearance: none;
cursor: pointer}

#respond input[type="submit"]:hover
{background-color: #ffaa00}

#respond .required{color: #ff0000}


/* お問い合わせフォーム */
.wpcf7 input,
.wpcf7 textarea{width: 100%;
padding: 5px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box}

.wpcf7 input[type="submit"]
{width: 200px;
padding: 10px;
border: none;
background-color: #e6cc1c;
-webkit-appearance: none;
cursor: pointer}

.wpcf7 input[type="submit"]:hover
{background-color: #ffaa00}



/* メディアクエリの設定 */
@media (min-width: 768px) {

/* ２段組 */
.container{max-width: 1000px;
padding-bottom:20px;
overflow: hidden}

.containernav{max-width: 1000px;
overflow: hidden}


}

@media (max-width: 768px) {

.blogmenu img{
width:100%;
}
}



@media (max-width: 414px) {

.blogmenu img{
width:100%;
}

.gazobox{
/* boxレイアウトの指定 */
display: block;

/* 配置したボックスを左右中央寄せにする */
box-pack: center;
-webkit-box-pack: center;
-moz-box-pack: center;

border: 1px solid #ccc;
border-radius: 5px;
padding:0 20px 0 0;
margin-bottom:15px;
}

}



/* 記事の概要 */
.excerpt p{font-size: 14px}

.excerpt .more a{padding: 5px 20px;
border: solid 1px #cccccc;
border-radius: 5px;
color: #000000;
text-decoration: none;}

.excerpt .more a:hover
{background-color: #e6cc1c}

.excerpt .more i{margin-left: 10px;
color: #cccccc}

@media (min-width: 500px) {
.excerpt img{float: left;
margin-right: 20px;
width: 40%}
}

@media (max-width: 499px) {
.excerpt img{display: block;
margin-left: auto;
margin-right: auto}

}



/* トップページ */
.largeheader{width: 100%;
height: auto;
vertical-align: bottom}

.home header{margin-bottom: 0}

.home footer{margin-top: 0}


/* トップページのメニュー */
.topmenu{padding-top: 40px;
padding-bottom: 40px}

.link{text-align: center;
margin-bottom: 15px}

.link a{color: #aaaaaa;
font-size: 20px;
text-decoration: none}

.link i{display: block;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
width: 150px;
line-height: 150px;
border-radius: 75px;
background-color: #ecc952;
color: #ffffff;
font-size: 50px}

.link:nth-child(2) i
{background-color: #e8a380}

.link:nth-child(3) i
{background-color: #b7ef6b}


@media (min-width: 500px) {
.topmenu{overflow: hidden}

.link{float: left;
width: 33.3333%}
}



/*ドロワーメニュー*/

.panel .btn {
position: fixed;
color:#fff;
display: block;
right: 0px;
padding-top: 10px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
z-index: 9999;
background-color: #F90;
cursor: pointer;
}
 
.panel .btn:hover {
   filter: alpha(opacity=90);
opacity: .90;
}
 
.panel .cbtn {
z-index: 99;
display: none;
top: 0;
left: 0;
position: fixed;
}
 
.panel .check {
    display: none;
}
 
.panel ul {
position: fixed;
z-index: 999;
display: block;
font-size: 0.9em;
background-color: #F6F6F6;
max-width: 1000px;
top: -500px;
margin-right: 2%;
padding: 5%;
list-style-type: none;
    
transition: 0.5s ease-in-out;
-webkit-transition: 0.5s ease-in-out;
-moz-transition: 0.5s ease-in-out;
}
 
.panel .check:checked + ul {
top: 30px;
}
 
.panel .check:checked + ul + .cbtn {
display: block;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.2);
}
 
.panel ul li{
padding-right: 5px;
padding-left: 5px;
}
 
.panel a {
display: block;
padding: 10px;
text-align: center;
margin-top: 15px;
background-color: #999;
color: #FFF;
text-decoration: none;
}
 
.panel a:hover {
background-color: #666;
}

@media (max-width: 480px) {
.simcal-event-title{

}
}


*, *:before, *:after {
box-sizing: border-box;
}
.col_2{
width: 100%;
display: flex;
display: -ms-flexbox; /* IE10 */
flex-wrap: wrap;
-ms-flex-wrap: wrap; /* IE10 */
}
.col_2 > div{
width: 50%;
padding: 10px;
}
@media screen and (max-width: 960px) {
.col_2 > div{
width: 100%;
}
}
