
/*
Theme Name: aircon-hellonet
Theme URI: https://aircon-hellonet.com/
Description: This is for hellonet.com
Version: 1.0
Author: Alicexdesign
Author URI: https://aircon-hellonet.com/
Tags: white
*/


/*
==================================================
１カラムレイアウト
==================================================
*/
#column1 #menu,
#column1 #main {
  float: none;
  width: 100%;
  box-sizing:border-box;
}
@media screen and (min-width: 768px) {
  #column1 #main {
    padding-left:16px;
    padding-right:16px;
 }
  #column1 #text1, #column1 #text2, #column1 #text3, #column1 #text4, #column1 #text5, #column1 #text6, #column1 #text7, #column1 #text8, #column1 #text9, #column1 #text10, #column1 #space1, #column1 #space2 {padding:16px 24px;}
  #column1 #menu h4, #column1 #menu .title, #column1 #rmenu h4, #column1 #rmenu .title {
	padding: 14px 10px 14px 40px;
  }
  #column1 #menu h4:after, #column1 #menu .title:after, #column1 #rmenu h4:after, #column1 #rmenu .title:after {
    width: 97%;
  }
  #column1 #menu .menubox,
  #column1 #rmenu .menubox {
	padding: 10px 25px;
  }
  #column1 #menu .menulist,
  #column1 #rmenu .menulist {
	padding: 10px 25px 5px 25px;
  }
  #column1 #menu .menulist ul,
  #column1 #rmenu .menulist ul {
	overflow: hidden;
	padding: 0;
  }
  #column1 #menu .menulist li,
  #column1 #rmenu .menulist li {
	float: left;
	margin: 0 15px 0 0;
  }
  #column1 #menu .menulist li a:hover,
  #column1 #rmenu .menulist li a:hover {
	text-decoration: underline;
  }
  #column1 #menu .menulist .l2 a,
  #column1 #menu .menulist .l3 a,
  #column1 #rmenu .menulist .l2 a,
  #column1 #rmenu .menulist .l3 a {
	font-size: 14px;
	line-height: 1.75;
  }
  #column1 #menu .menulist .l2 a::after,
  #column1 #menu .menulist .l3 a::after,
  #column1 #rmenu .menulist .l2 a::after,
  #column1 #rmenu .menulist .l3 a::after {
	border: 4px solid transparent;
	border-left: 6px solid #3a628b;
	height: auto;
	left: 9px;
	margin-top: 0;
	right: auto;
	-moz-transform: rotate(0);
	-ms-transform: rotate(0);
	-webkit-transform: rotate(0);
	transform: rotate(0);
	top: 10px;
	width: auto;
  }
  #column1 #menu .menulist .l3 a,
  #column1 #rmenu .menulist .l3 a {
	padding-left: 22px;
  }
  #column1 #menu .menulist .l3 a::before,
  #column1 #rmenu .menulist .l3 a::before {
	display: none;
  }
  #column1 #menu .menulist .l3 a::after,
  #column1 #rmenu .menulist .l3 a::after {
	display: block;
  }
  #column1 ul#newEntry, #column1 ul#entryarchive {
	padding: 0;
  }
  #column1 ul#newEntry li, #column1 ul#entryarchive li {
	display: inline-block;
	margin-right: 10px;
  }
  #column1 #categorylist .body {
	background-position: left top;
	background-repeat: repeat;
	color: #4e4e4e;
	padding: 0;
	text-align: left;
	width:95%;
	margin:0 auto;
  }
  #column1 #categorylist .thumb {
	float: left;
	margin: 0 15px 5px 0;
  }
  #column1 #categorylist .thumb img {
	display: block;
	max-width: 200px;
  }
  #column1 #categorylist p {
	background-image: none;
	font-size: 14px;
	line-height: 30px;
	overflow: hidden;
	padding: 0;
  }
  #column1 #categorylist p::before {
	display: none;
  }
  #column1 #categorylist .more {
	margin: 7px 5px 10px 0;
  }
  #column1 .rank .rank-container {
	padding: 0;
	position: relative;
  }
  #column1 .rank .rank-container::before {
	height: 70px;
	margin: 0 0 -25px;
	max-height: 70px;
	top: -36px;
  }
  #column1 .rank .rank1, #column1 .rank .rank2, #column1 .rank .rank3, #column1 .rank .rank4, #column1 .rank .rank5, #column1 .rank .rank6, #column1 .rank .rank7, #column1 .rank .rank8, #column1 .rank .rank9, #column1 .rank .rank10 {
	background-position: left top;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 22px;
	line-height: 1.5;
	margin: 10px 0 8px 12px;
  }
  #column1 .rank .rank1, #column1 .rank .rank2, #column1 .rank .rank3 {
	background-size: 96px auto;
	min-height: 69px;
	padding: 18px 0 0 112px;
  }
  #column1 .rank .rank4, #column1 .rank .rank5, #column1 .rank .rank6, #column1 .rank .rank7, #column1 .rank .rank8, #column1 .rank .rank9, #column1 .rank .rank10 {
	background-size: auto auto;
	min-height: 61px;
	padding: 12px 0 0 80px;
  }
  #column1 .rank .rank-inner {
	padding: 35px;
  }
  #column1 .rank .rankbox {
	margin-bottom: 25px;
  }
  #column1 .rank .rank-table table {
	margin: 25px 0;
  }
  #column1 .rank .comment {
	margin: 25px 0;
  }
  #column1 .rank .more {
	margin: 25px 0 0;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	    -ms-flex-direction: row;
	        flex-direction: row;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
  }
  #column1 .rank .more span{
	width:46%;
	margin-left:2%;
	margin-right:2%;
  }
}
@media screen and (min-width: 1000px) {
  #column1 #menu .menulist li a:hover,
  #column1 #rmenu .menulist li a:hover {
	color: #7591ad;
	text-decoration: underline;
  }
  #column1 #categorylist .thumb img {
	max-width: 250px;
  }
  #column1 .rank .rank-container::before {
	height: 96px;
	margin: 0 0 -30px;
	max-height: 96px;
	top: -46px;
  }
  #column1 .rank .more::after {
	clear: both;
	content: "";
	display: block;
  }
  #column1 .rank .more span.official a:hover {
	background-image: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
  }
}



/*
==================================================

==================================================

==================================================
*/
#main {
  text-align: left;
  margin: auto;
  padding: 0;
  width: 100%;
}
#main .text, #text1, #text2, #text3, #text4, #text5, #text6, #text7, #text8, #text9, #text10, #space1, #space2 {
  background-color: #ffffff;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  margin: 10px auto 20px;
  //overflow: hidden;
  padding: 10px 0;
  position: relative;
  width: 95%;
  z-index: 0;
}
@media screen and (min-width: 768px) {
  #main {
	float: right;
	width: 75%;
  }
  #main .text, #text1, #text2, #text3, #text4, #text5, #text6, #text7, #text8, #text9, #text10, #space1, #space2 {
	padding: 15px;
  }
}
@media screen and (min-width: 1000px) {
  #main {
	width: 750px;
  }
  #main .text, #text1, #text2, #text3, #text4, #text5, #text6, #text7, #text8, #text9, #text10, #space1, #space2 {
	margin-bottom: 20px;
  }
}






/*
基本スタイル
==================================================
*/
body {
  background-color: #f9f6ee;
  color: #131313;
  font-family: 'メイリオ',Helvetica,'Hiragino Kaku Gothic Pro',sans-serif;
  font-size: 16px;
  line-height: 1.8;
  text-align: center;
  -webkit-text-size-adjust: 100%;
  padding:0 5px;
  
}
h1, h2, h3, h4, h5, h6, .title, dt {
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Verdana,'ＭＳ Ｐゴシック',sans-serif;
  font-weight: bold;
  padding:0 5px;
}
h2,h3,h4,h5,h6{
	overflow:hidden;
}
.clear {
  clear: both;
  font-size: 1px;
  line-height: 0;
}
p {
  margin: 0;
}
img {
  height: auto;
  max-width: 100%;
  vertical-align: middle;
}






body {
  font-family: "Arial", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN",
    "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	margin:0;
	padding:0;
	background-image : #ccffff;
}

TABLE{
  background-color : #ffffff;
  	width: 1000px;
}

img {
	border: none;
}
.contents { padding:8px;
}

/* tableのセル同士の重複で線が重なって太くなるの回避する場合使用
table {
border-collapse: collapse;
border-spacing: 0px;
}
*/

H1{
	font-size : medium;color : gray;
}
H2{
	font-size :  22px;color : gray;
}
td,th {
	padding: 0px;
	empty-cells: show;
  	font-size : 20px;
}
td {
	font-size : 22px;
}
strong{
	color : gray;
}
A{
	color : black;
}
A:hover{
	color : gray;
}
TABLE2{
	line-height : 30px;
}
a{
	text-decoration: none;
}
a:hover{
	text-decoration: underline;
}

img {
	max-width:100%;
	height:auto;}
	
/* PCで電話番号リンクを無効に */
@media (min-width: 768px) {
    a[href*="tel:"] {
        pointer-events: none;
        cursor: default;
        text-decoration: none;
    }
}

@media (max-width: 800px) {
H1{
    color : gray;
  }
H2{
    color : gray;
  }
TD{
    font-size : large;
   }
   
table {
 width: 100%;
   table-layout: fixed;
   }
th {
     display: block;
     width: 100%;
     empty-cells: show;
   
   }
   
td {
     empty-cells: show;
     line-height:150%;
   }
   

.p27 {
	width:33%;
	height:auto;}
.p20 {
	width:20%;
	height:auto;}
.p90 {
	width:90%;
height: auto;
    display: block;
    margin: 0 auto;}
.p80 {
	width:80%;
height: auto;
    display: block;
    margin: 0 auto;}
 p{
     font-size: 10px;
   }
   .ggmap {
   position: relative;
   padding-bottom: 56.25%;
   padding-top: 30px;
   height: 0;
   overflow: hidden;
   }
    
   .ggmap iframe,
   .ggmap object,
   .ggmap embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   }
   
   ul.menu{
     padding:0 10px;
     }
     ul.menu li{
     padding:0px;
     }

}  

/* スマホ　767px以下 */
@media screen and (max-width: 767px){

/* レスポンシブ化する際スマホで改行消したいのでbrタグを消す */
br.br-sp { display : none ; }

/* 画面サイズによってフォントサイズを変える */
h1 {
font-size: 14px;
  }

h2 {
font-size: 14px;

  }

TD{
font-size: 14px;

  }
  
table {
width: 100%;
table-layout: fixed;
}

th {

  width: 100%;
  empty-cells: show;

}

td {
  width: 100%;
  empty-cells: show;
  font-size: 14px;
    line-height: 150%;
    font-weight: 500;
/*letter-spacing: 0.1em; */
}
.menu-f {

}
td.va1 {
  width: 100%;
}

table.w1{
  width: 640px;
}
table.w2{
  width: 680px;
}

/* 水平方向真ん中に設置するためのclass */
.va2 {
  vertical-align: -0.35em;
}

th.pict01 {
  display: block;
  width: 100%;
}

td.pict01 {
  display: block;
  width: 100%;
}
td.w3 {
  font-size: 14px;
}

img.pict01 {
		width: 100%;
		height: auto;
	}
img.pict02 {

		width: 70%;
		height: auto;
}
img.pict03 {

		width: 50%;
		height: auto;
}
img.pict04
{
		width: 35%;
		height: auto;
}
img.pict05
{
		width: 25%;
		height: auto;
}
img.pict06
{
  width: 15%;
  height: auto;
}
table.w1{
  width: 70%;
}
table.w2{
  width: 75%;
}
table.w3{
  width: 90%;
}
p{
  font-size: 13px;
}
.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

ul.menu{
  padding:0 10px;
  }
  ul.menu li{
  padding:0px;
  }
.footer-logo {
	max-width:100%;
	width:60%;
	height:auto;}
}


	
/* smt用下部お問い合わせボタン */


@media (min-width: 768px) {
   .for-sp{
      display:none !important;
    }
}

@media screen and (max-width: 767px){
#sp-fixed-menu{
   position: fixed;
   width: 100%;
   bottom: 0px;
   font-size: 0;

   z-index: 99;
    background-color: rgb(0 0 0 / 80%);
	text-align:center;
	padding:2% 0 2%;
}


/*メニューを横並びにする*/
#sp-fixed-menu ul{
   display: flex;
   list-style: none;
   padding:0;
   margin:1% 0 0 0;
   width:100%;

}

#sp-fixed-menu li{
   justify-content: center;
   align-items: center;
   width: 47%;
   padding:0;
   margin-left:2%;
}
#sp-fixed-menu li:last-child{
	  margin-right:2%;
}
#sp-fixed-menu li a{
   text-align: center;
   display:block;
   opacity: 1;
}

.contents { margin-bottom:100px;
}	
}



#pattern1 {
    font-size : 80%;
}

*/

