﻿@charset "utf-8";

#temprete{
	width: 1020px;
	margin: 50px auto 0;
}
#temprete .t1_title{
	background-color: #403475;
	color:white;
	font-size: 35px;
	font-weight: bold;
	padding: 5px;
	margin: 10px auto;
}
#temprete .t1_sub{
	font-size: 20px;
	text-align: left;
	margin: 10px auto;
	font-weight: bold;
	color:#403475;
}
#temprete .t2_title{
	background-color: #EB613B;
	color:white;
	font-size: 35px;
	font-weight: bold;
	padding: 5px;
	margin: 10px auto;
}
#temprete .t2_sub{
	font-size: 20px;
	text-align: left;
	margin: 10px auto;
	font-weight: bold;
	color:#EB613B;
}
#temprete .t3_title{
	background-color: #008F47;
	color:white;
	font-size: 35px;
	font-weight: bold;
	padding: 5px;
	margin: 10px auto;
}
#temprete .t3_sub{
	font-size: 20px;
	text-align: left;
	margin: 10px auto;
	font-weight: bold;
	color:#008F47;
}
#temprete .t1_sub2{
	border-bottom: 2px solid #403475;
	font-size: 20px;
	font-weight:bold ;
	margin: 10px auto;
	color:#403475;
}
#temprete .t2_sub2{
	border-bottom: 2px solid #EB613B;
	font-size: 20px;
	font-weight:bold ;
	margin: 10px auto;
	color:#EB613B;
}
#temprete .t3_sub2{
	border-bottom: 2px solid #008F47;
	font-size: 20px;
	font-weight:bold ;
	margin: 10px auto;
	color:#008F47;
}
#temprete .top-area{
	margin: 50px auto;
	text-align: center;
}
#temprete .top-area li{
    margin: 5px auto;
    text-align: left;
}
#temprete .mid-area{
	clear: both;
	overflow: hidden;
	margin: 20px auto;
}
#temprete .mid-area .left{
	float: left;
	width: 300px;
	margin: 0 auto;
	text-align: center;
}
#temprete .mid-area .right{
	float: right;
    width: 660px;
    margin: 0 auto;
    text-align: left;
    padding: 5px;
}
#temprete .mid-area-img{
	margin: 30px auto;
	clear: both;
	overflow: hidden;
	
}
#temprete .mid-area-img ul{
    clear: both;
    overflow: hidden;
}
#temprete .mid-area-img li{
	width: 320px;
	float:left;
	margin: 0 10px;
    text-align: center;
}
#temprete .mid-area-img .last{
	margin-right: 0;
}
#temprete .comment-area{
	clear: both;
	overflow: hidden;
	margin: 30px auto;
}
#temprete .comment-area p{
	padding:10px;
}
#temprete .comment-area li{
	margin: 10px auto;
}
#temprete .comment-area ul {
    margin-left: 50px;
}
#temprete .comment-area2{
	clear: both;
	overflow: hidden;
	margin: 30px auto;
}
#temprete .comment-area2 .t{
	border-bottom: 1px solid #0220B6;
	font-size: 20px;
	font-weight:bold ;
}
#temprete .comment-area2 p{
	padding:10px;
}
#temprete .comment-area2 li{
	margin: 10px auto;
}
#temprete .comment-area2 ul {
    margin-left: 50px;
}
#temprete .schedule_frame {
    clear: both;
    overflow: hidden;
}
#temprete table {
    width: 340px;
    margin: 50px auto;
    float: left;
}
#temprete table thead .t1_table{
    background-color: #8f85bd;
	padding: 5px;
    text-align: center;
    border: 1px solid black;
	font-weight: bold;
	color: white;
}
#temprete table thead .t2_table{
    background-color: #EB613B;
	padding: 5px;
    text-align: center;
    border: 1px solid black;
	font-weight: bold;
	color: white;
}
#temprete table thead .t3_table{
    background-color: #008F47;
	padding: 5px;
    text-align: center;
    border: 1px solid black;
	font-weight: bold;
	color: white;
}
#temprete table thead td{
    background-color: #8f85bd;
    text-align: center;
    border: 1px solid black;
	font-weight: bold;
}
#temprete table tbody th{    
	border: 1px solid black;
    padding: 5px;
}
#temprete table tbody td{    
	border: 1px solid black;
    padding: 5px;
}
#temprete .bottom-area {
    clear: both;
    overflow: hidden;
    margin: 20px auto 100px;
}
#temprete .bottom-area .left{
	width:510px;
	float: left;
	margin:0 auto;
}
#temprete .bottom-area .right{
	width:510px;
	float: right;
	margin:0 auto;
}
.bottom-area{
	clear: both;
	overflow: hidden;
}
.bottom-area .t1 {
    font-weight: bold;
    font-size: 15px;
    color: #403475;
}
.bottom-area .t2 {
    font-weight: bold;
    font-size: 15px;
    color: #EB613B;
}
.bottom-area .t3 {
    font-weight: bold;
    font-size: 15px;
    color: #008F47;
}
.bottom-area dl {
    width: 510px;
    margin: 10px auto;
    float: left;
}
.bottom-area dl dt {
    width: 200px;
    float: left;
    margin: 0 auto;
}
.bottom-area dl dd {
    width: 300px;
    float: right;
    margin: 0 auto;
}

#temprete .comment-area2 span {
    padding: 0 15px;
}


/*テンプレート1　基本*/
#temprete .frame_b{
    clear:both;
    overflow:hidden;
    border: 1px solid;
}
#temprete .frame_b ul {
    clear: both;
    overflow: hidden;
}
#temprete .frame_b .a{
    width: 5.2%;
    float: left;
    text-align: center;
    background-color: #d9d6e8;
}
#temprete .frame_b .last{
    border-right: none;
}
#temprete .frame_b li{
    width: 28.8%;
    float: left;
    padding: 1%;
    border-right: 1px solid black;
    border-bottom: 1px solid black;
}
#temprete .frame_b .last_bnone li{
    border-bottom: none;
}
#temprete .frame_b .title{
    background-color:#8f85bd;
    color:white;
    text-align:center;
    font-weight:bold;
}

#temprete .frame_b .title .a{
    color:white;
    background-color:#8f85bd;
}

/*テンプレート2*/
#temprete .frame_b {
    margin: 20px auto 50px;
}
#temprete .frame_b .title_2{
    background-color:#EB613B;
    color:white;
    text-align:center;
    font-weight:bold;
}
#temprete .frame_b .title_2 .a {
    width: 5.2%;
    float: left;
    text-align: center;
    background-color: #EB613B;
}
#temprete .frame_b .title_2 .a_2top {
    width: 5.2%;
    float: left;
    text-align: center;
    color: white;
    background-color: #EB613B;
}
#temprete .frame_b .a_2 {
    width: 5.2%;
    float: left;
    text-align: center;
    background-color: #f2dfd9;
}
/*テンプレート3*/
#temprete .frame_b {
    margin: 20px auto 50px;
}
#temprete .frame_b .title_3{
    background-color:#008F47;
    color:white;
    text-align:center;
    font-weight:bold;
}
#temprete .frame_b .title_3 .a {
    width: 5.2%;
    float: left;
    text-align: center;
    background-color: #008F47;
}
#temprete .frame_b .title_3 .a_3top {
    width: 5.2%;
    float: left;
    text-align: center;
    color: white;
    background-color: #008F47;
}
#temprete .frame_b .a_3 {
    width: 5.2%;
    float: left;
    text-align: center;
    background-color: #c6ead8;
}
/**************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/


@media screen and (max-width: 768px){
#temprete {
    width: 90%;
    margin: 0 auto;
    padding-top: 80px;
}
#temprete .mid-area .left {
    float: none;
    width: 100%;
	margin: 10px auto 30px;
}
#temprete .mid-area .right {
    float: none;
    width: 100%;
}
section {
    padding: 0;
}
#temprete .mid-area-img li {
    width: 100%;
    float: none;
    margin: 20px auto;
}
#temprete .comment-area ul {
    margin-left: 30px;
}
.schedule_frame {
    clear: both;
    overflow: hidden;
    margin: 20px auto;
    width: 100%;
}
#temprete table {
    width: 100%;
    margin: 0 auto;
}
#temprete table thead th {
    padding: 5px 0;
}
#temprete table tbody th {
    width: 96%;
    display: block;
    padding: 5px;
    margin: 0 auto;
}
#temprete table tbody td {
        width: 96%;
    display: block;
    padding: 5px;
    margin: 0 auto;
}
.bottom-area dl {
    width: 100%;
    margin: 10px auto;
    float: none;
}
.bottom-area dl dt {
    width: 100%;
    float: none;
	text-align: center;
}
.bottom-area dl dd {
    width: 100%;
    float: none;
}
#temprete .bottom-area {
    clear: both;
    overflow: hidden;
    margin: 20px auto 50px;
}
#temprete .comment-area2 ul {
    margin-left: 30px;
}
#temprete .frame_b .a {
    width: 100%;
    float: none;
}
#temprete .frame_b li {
    width: 100%;
    float: none;
}
#temprete .frame_b .last_bnone li {
    border-bottom: 1px solid;
}
#temprete .frame_b .last_bnone .last {
    border-bottom: none;
}

/*テンプレート2*/
#temprete .frame_b .title_2 {
    width: 100%;
    float: none;
}
#temprete .frame_b .title_2 .a_2top {
    width: 100%;
    float: none;
}
#temprete .frame_b .a_2 {
    width: 100%;
    float: none;
}
/*テンプレート3*/
#temprete .frame_b .title_3 {
    width: 100%;
    float: none;
}
#temprete .frame_b .title_3 .a_3top {
    width: 100%;
    float: none;
}
#temprete .frame_b .a_3 {
    width: 100%;
    float: none;
}
}