@charset "UTF-8";
/* CSS Document */
.company_top {
	text-align: center;
	font-size: 30px;
	background-image: url("../img/product/product_top.png");
	width: 100%;
	height: 250px;
	background-size: cover;
	text-align: center;
	color: #fff;
	font-family: "Montserrat",sans-serif;	
}
.company_title {
	padding-top: 110px;
}
.company_top img {
	width: 100%;
	height: auto;
}
/* ▼(A)表示領域全体 */
div.tabbox { 
	margin: 50px auto;
	padding: 0px;
	width: 1160px; 
}

/* ▼(B)タブ部分 */
p.tabs { 
	margin: 0px; 
	padding: 0px; 
}
p.tabs a {
   /* ▼(B-2)リンクをタブのように見せる */
   display: block; 
   width: 5em; 
   float: left;
   margin: 0px 1px 0px 0px; 
   padding: 10px;
   text-align: center;
   text-decoration: none;
}
/* ▼(B-3)各タブの配色 */
p.tabs a.tab1 { 
	background-color: #95eaea;  
	color: white; 
}
p.tabs a.tab2 { 
	background-color: #4edcdc; 
	color:white;
}
p.tabs a.tab3 { 
	background-color: #2bd5d5;
	color: white; 
}
p.tabs a.tab4 {
	background-color: #72e2e2;
	color:#fff;
}
p.tabs a:hover { 
	color: #000;
}

/* ▼(C)タブ中身のボックス */
div.tab {
   /* ▼(C-2)ボックス共通の装飾 */
   overflow: auto; 
   clear: left;
}
/* ▼(C-3)各ボックスの配色 */
div#tab1 { border: 6px solid #95EAEA; background-color: #fff; }
div#tab2 { border: 5px solid #4EDCDC; background-color: #fff; }
div#tab3 { border: 6px solid #2BD5D5; background-color: #fff; }
div#tab4 { border: 5px solid #72E2E2; background-color: #fff; }
div.tab p { margin: 0.5em; }

.patos_wrap {
	width: 100%;
	margin: 0 auto;
	padding:4%;
	box-sizing:border-box;
}
.patos_title {
	font-size: 28px;
	font-weight:bold;
	color: #7DC2E0;
}
.regista_title {
    color: #B1E0CA;
    font-size: 28px;
    font-weight: bold;
}
.logos_title {
    color: #C1DDB1;
    font-size: 28px;
    font-weight: bold;
}
.patos_detail {
	font-size: 14px;
	line-height:30px;
}
.product_patos_name {
	color:#3ea7e8;
	padding: 0 0 10px;
	border-bottom:2px dotted #bababa;
	letter-spacing:2px;
	font-size:22px;
	font-weight:bold;
	font-family: 'Lora', serif;
}
.patos_description{
	border-bottom: 1px solid #eee;
    font-size: 14px;
    line-height: 24px;
    padding: 2% 0 2%;
}
.patos_1{
	padding: 5% 0 0 0;
	list-style-type: none;
	clear: both;
}
.patos_1:last-child {
	padding: 3% 0 5% 0;
}
.patos_1_left {
	width: 75%;
	margin: 3% 0 0 0;
	float: right;
}
.patos_price span{
	color: #ed7b93;
	font-weight: bold;
}
.patos_1_right {
	border: 5px solid #fff;
    box-shadow: 0 0 10px #ccc;
    float: left;
    font-size: 1px;
    line-height: 0;
    vertical-align: bottom;
    margin-bottom: 5%;
    width: 20%;
}
.patos_1_right img {
	width: 100%;
	height: auto;
}

@media screen and (max-width: 768px) {
.company_top {
	text-align: center;
	font-size: 30px;
	margin: 80px auto;
	height: auto;
	width: 100%;	
}
.patos_top img {
	max-width: 100%;
	height: auto;
}
div.tabbox { 
	margin: 50px auto;
	padding: 0px;
	width: 96%; 
}
.patos_1_left {
	width: 75%;
	margin: 0;
	float: right;
}

}
@media screen and (max-width: 480px) {
.company_top {
	text-align: center;
	font-size: 30px;
	margin: 80px auto;
	width: 100%;	
}
.company_top img {
	width: 100%;
	height: auto;
}
.patos_title {
    color: #076e8d;
    font-size: 20px;
    font-weight: bold;
}
.regista_title {
	font-size: 20px;
}
.logos_title {
	font-size: 20px;
}
.patos_detail {
    font-size: 12px;
    line-height: 30px;
    padding-bottom: 8%;
}
.patos_1{
	padding: 0;
	list-style-type: none;
	clear: both;
	width: 90%;
	margin: 10% auto;
}
.patos_1_left {
	width: 100%;
	margin: 3% 0 0 0;
	float: none;
}
.product_patos_name {
    border-bottom: 2px dotted #bababa;
    color: #3ea7e8;
    font-family: "Lora",serif;
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 2px;
    padding: 0 0 10px;
}
.patos_description {
    border-bottom: 1px solid #eee;
    font-size: 12px;
    line-height: 24px;
    padding: 2% 0;
}
.patos_1_right {
	border: 5px solid #fff;
    box-shadow: 0 0 10px #ccc;
    float: none;
    font-size: 1px;
    line-height: 0;
    vertical-align: bottom;
    margin-bottom: 5%;
    width: 100%;
}
}