*{
	margin: 0px;
	padding: 0px;
}
section,article,aside,hgroup,header,footer,nav,figure {
	display: block;
}
body {
	color: #212121;
    font-family:helvetica,arial,sans-serif;
	font-size:1em;
	line-height:1.5em;
	background-color:#ffffff;
	background-repeat: no-repeat;
	background-size:cover;
	background-attachment: fixed;
    margin-top: 56px;
}
a {
    color:#212121;
	text-decoration: none;
}
a img {
	border-style: none;
}
p {
	text-align: center;
}

/* ヘッダー */
.header{
    display:block;
    position:fixed;
    top:0;
    left:0;
    right:0;
    width:100%;
    height:56px;
    background-color:#fafafa;
    z-index:100;
}
.header_title{
    position:absolute;
    top:50%;
    transform:translate(0,-50%);
    left:16px;
    font-size:1em;
    color:rgba(0,0,0,.54);
    display:inline-block;
}
.header_content{
    position:relative;
    height:100%;
}
.header_content img{
    vertical-align:middle;
}
@media all and (min-width: 900px) {
    .header_title{
        left:24px;
    }
    .header_content{
        max-width:900px;
        margin:0 auto;
    }
    .header .storeButtons{
        display:none;
    }
}
.header_title img{
    height:32px;
}
.header .storeButtons img{
    height:32px;
}
.header .storeButtons{
    position:absolute;
    top:50%;
    transform:translate(0,-50%);
    right:16px;
}


/* パンくず */
.breadcrumbs {
	padding: 16px 0px 16px 16px;
}
.breadcrumbs p {
	text-align: left;
	font-size: 0.8em;
}
.breadcrumbs a {
	text-align: left;
	font-size: 0.8em;
	color: #0b94d9;
}


#nengabanner img {
    width: 100%;
}

/* テンプレートタイトル部分 */
#templatetitle {
	margin-top: 20px;
	margin-bottom: 20px;
	background-image: url("../img/img_triangle.png");
	background-repeat: repeat-x;
}
#templatetitle p {
	padding-top: 60px;
	color: #866D3A;
	font-size: 1.5em;
	font-weight: bold;
}

/* テンプレートタブ部分 */
/*タブ切り替え全体のスタイル*/
.tabs {
	background-color: #FAF8F1;
	width: 100%;
	margin: 0 auto;
}

/*タブのスタイル*/
.tab_item {
	width: 33.33%;
	height: 50px;
	background-color: #ffffff;
	line-height: 50px;
	font-size: 12px;
	text-align: center;
	color: #212121;
 	display: block;
	float: left;
	text-align: center;
	font-weight: bold;
	border-bottom: 4px solid rgba(0,0,0,0);
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
}
.tab_item:hover {
    background-color: #fafafafa;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
	display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
	display: none;
	padding: 16px;
	clear: both;
	overflow: hidden;
}

/*選択されているタブのコンテンツのみを表示*/
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content {
	display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
	border-color: #866D3A;
	background-color: #ffffff;
	color: #212121;
}

/* テンプレートサムネ部分 */
.tab_content img {
    display: inline-block;
    float: left;
    width: 44%;
    margin: 3%;
	box-shadow: 0px 2px 8px	rgba(0,0,0,0.5);
}

@media screen and (min-width: 500px) {
    .tab_content {
        padding: 40px;
    }
    .tab_content img {
        width: 30.33%;
        margin: 1.5%;
    }
}

@media screen and (min-width: 900px) {
    .tab_content img {
        width: 22%;
        margin: 1.5%;
    }
}

.breadcrumbs, #nengabanner, #contents {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.android .invisible-for-android,
.ios .invisible-for-ios,
.desktop .invisible-for-desktop,
.unisolated .isolated-content,
.isolated .unisolated-content {
    display: none !important;
}
