@charset "UTF-8";


/* #################################################################################################################### */
/* #################################################################################################################### */
/* ▼ボタン
*/

/*
・PHP：include-files/rentalserver/display.php
・用途：新しい記事一覧のリンクボックスの中のタイトルで使用
・記事：https://wepicks.net/rentalserver-price-cheap/ 表の業者名
*/
/* ボタンテキスト 角丸 リンク */
.button_text_round_blue {
	display: inline-block;
	padding: 0px;
	text-decoration: none;
	color: #67c5ff;
	border: solid 1px #67c5ff;
	border-radius: 3px;
	transition: .4s;
}
.button_text_round_blue:hover {
	background: #67c5ff;
	color: white;
}

/*ボタン テキスト サンプル用 オレンジ*/
.button_text_sample_orange{}

.button_text_sample_orange A:link{
	position: relative;
	display: inline-block;
	padding: 0.15em 0.5em;
	text-decoration: none;
	color: #FFF;
	background: #fd9535;/*背景色*/ border-bottom: solid 2px #d27d00;/*少し濃い目の色に*/ border-radius: 4px;/*角の丸み*/ box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
	font-weight: bold;
	}.square_btn:active {
	border-bottom: solid 2px #fd9535;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

.button_text_sample_orange A:visited{
	position: relative;
	display: inline-block;
	padding: 0.15em 0.5em;
	text-decoration: none;
	color: #FFF;
	background: #fd9535;/*背景色*/ border-bottom: solid 2px #d27d00;/*少し濃い目の色に*/ border-radius: 4px;/*角の丸み*/ box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
	font-weight: bold;
	}.square_btn:active {
	border-bottom: solid 2px #fd9535;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}

.button_text_sample_orange A:hover{
	position: relative;
	display: inline-block;
	padding: 0.15em 0.5em;
	text-decoration: none;
	color: #FFF;
	background: #fd9535;/*背景色*/ border-bottom: solid 2px #d27d00;/*少し濃い目の色に*/ border-radius: 4px;/*角の丸み*/ box-shadow: inset 0 2px 0 rgba(255,255,255,0.2), 0 2px 2px rgba(0, 0, 0, 0.19);
	font-weight: bold;
	}.square_btn:active {
	border-bottom: solid 2px #fd9535;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.30);
}


/* #################################################################################################################### */
/* #################################################################################################################### */
/* ▼ナビゲーション
*/

/*
・PHP：無し
・用途：ページ遷移次へリンク
・記事：多数

.global-naviの名前に合わせる
.btnBefore
.btnNext
.btnPageTrBase
.btnPageTrAct
.btnPageTrAct:hover
*/
.page_navi_box_previous{
	display:block;
	margin:0 0 30px 0;
	text-align:left;
	float:left;
	width:48%;
}
.page_navi_box_next{
	display:block;
	margin:0 0 20px 0;
	text-align:right;
	float:right;
	width:48%;
}
.page_navi_link{
	height:40px;
	font-size: 12px;
	line-height:120%;
	width:60%;
	padding: 7px 10px;
	font-weight: bold;
	display: inline-block;
	text-decoration: none !important;
	border-radius: 1px;
}
.page_navi_link_action{
	background-color: #3169d1;
	color: #fff !important;
	background-size: 200% 100%;	
	background-image: -webkit-linear-gradient(left, transparent 50%, rgba(153, 139, 250, 1) 50%);	
	background-image: linear-gradient(to right, transparent 50%, rgba(153, 139, 250, 1) 50%);
	-webkit-transition: background-position .3s cubic-bezier(0.19, 1, 0.22, 1) .1s, color .5s ease 0s, background-color .5s ease;
	transition: background-position .3s cubic-bezier(0.19, 1, 0.22, 1) .1s, color .5s ease 0s, background-color .5s ease;
}
.page_navi_link_action:hover{
	background-color: #998bfa;
	background-position: -100% 100%;
}


/*
・各ページの遷移テキストリンク
*/

/*上へ*/
.navi_page_text_up_area{
	width:200px;
	text-align:right;
	float:right;
}

.navi_page_text_up{
	font-size: 12px;
	margin: 10px 0 0 0;
	padding: 0px 20px 0px 0px;
	background-image: url(images/gr_icon_link_up.png);
	background-repeat: no-repeat;
	background-position: right top;
}

/*前へ*/
.navi_page_text_previous_area{
	width:200px;
	text-align:left;
	float:left;
}

.navi_page_text_previous{
	font-size: 12px;
	margin: 10px 0 0 0;
	padding: 0px 0px 0px 20px;
	background-image: url(images/gr_icon_link_left.png);
	background-repeat: no-repeat;
	background-position: left top;
}

/*次へ*/
.navi_page_text_next_area{
	width:200px;
	text-align:right;
	float:right;
}

.navi_page_text_next{
	font-size: 12px;
	margin: 10px 0 0 0;
	padding: 0px 20px 0px 0px;
	background-image: url(images/gr_icon_link_right.png);
	background-repeat: no-repeat;
	background-position: right top;
}

/*前へ次へ上へリンク*/
.navi_page_text_next, .navi_page_text_previous, .navi_page_text_up A:link{
	color:#2baace;
}

.navi_page_text_next, .navi_page_text_previous, .navi_page_text_up A:visited{
	color:#2baace;
}

.navi_page_text_next, .navi_page_text_previous, .navi_page_text_up A:active{
	color:#2baace;
}

.navi_page_text_next, .navi_page_text_previous, .navi_page_text_up A:hover{
	color:#ff7f00;
}


/* #################################################################################################################### */
/* #################################################################################################################### */
/* ▼注目
*/
div.my_alert {
    background-color:#FFEFEF;
    margin:0 0 1em 0; padding:10px;
    color:#C25338;
    border:1px solid #fab1b1;
    line-height:1.5;
    clear:both;
    background-repeat:no-repeat;
    background-position:5px 5px;
    border-radius: 0.25rem;
}
div.my_alert span {
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/cmsfiles/wp-content/themes/original/common/images/gr-icon-cancel.png', sizingMethod='scale');
    width:48px; height:48px;
    position:relative;
    top:-5px; left:-5px;
    display:block;
    text-indent:-9999px;
    float:left;
}
html>body div.my_alert { background-image:url(/cmsfiles/wp-content/themes/original/common/images/gr-icon-cancel.png); }
html>body div.my_alert span { visibility:hidden; }
/* OK用 */
div.accepted {
    background-color:#eaffc2;
    border-color:#b1e372;
    color:#3A9805;
}
div.accepted span { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/cmsfiles/wp-content/themes/original/common/images/gr-icon-acepted.png', sizingMethod='scale'); }
html>body div.accepted { background-image:url(/cmsfiles/wp-content/themes/original/common/images/gr-icon-acepted.png); }
html>body div.accepted span { visibility:hidden; }
/* 警告用 */
div.warning {
    background-color:#ffffab;
    border-color:#f1e265;
    color:#CC7600;
}
div.warning span { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/cmsfiles/wp-content/themes/original/common/images/gr-icon-warning.png', sizingMethod='scale'); }
html>body div.warning { background-image:url(/cmsfiles/wp-content/themes/original/common/images/gr-icon-warning.png); }
html>body div.warning span { visibility:hidden; }


/* #################################################################################################################### */
/* #################################################################################################################### */
/* ▼便利データ　料金早見表
*/

/* アンダーバー */
.txtBrdBtm4Red	{border-bottom:4px solid #f77171;}
.txtBrdBtm4Ble	{border-bottom:4px solid #71b3f7;}
.txtBrdBtm4Grn	{border-bottom:4px solid #96e259;}
.txtBrdBtm4Ylw	{border-bottom:4px solid #f5dd59;}
.txtBrdBtm4Org	{border-bottom:4px solid #ffb12b;}
.txtBrdBtm4Gry	{border-bottom:4px solid #a8a8a8;}

/* 価格 */
#org-price-box-left{
	float:left;
	text-align:center;
	vertical-align:middle;
	width: 40% !important;
	height:160px;
	margin:0 0 10px 0;
}

#org-price-box-right{
	float:right;
	vertical-align:middle;
	width: 60% !important;
	height:160px;
	line-height:100% !important;
}

#org-price-box-left-long{
	float:left;
	text-align:center;
	vertical-align:middle;
	width: 40% !important;
	height:200px;
	margin:0 0 10px 0;
}

#org-price-box-right-long{
	float:right;
	vertical-align:middle;
	width: 60% !important;
	height:200px;
	line-height:170% !important;
}

#org-price-box-left-long-more{
	float:left;
	text-align:center;
	vertical-align:middle;
	width: 40% !important;
	height:230px;
	margin:0 0 10px 0;
}

#org-price-box-right-long-more{
	float:right;
	vertical-align:middle;
	width: 60% !important;
	height:230px;
	line-height:170% !important;
}

#org-price-box-left.bg-blue{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#308dcb+0,127dc4+100 */
background: #308dcb; /* Old browsers */
background: -moz-linear-gradient(top,  #308dcb 0%, #127dc4 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #308dcb 0%,#127dc4 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #308dcb 0%,#127dc4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#308dcb', endColorstr='#127dc4',GradientType=0 ); /* IE6-9 */
}
#org-price-box-left.bg-green{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#6bce29+0,46b724+100 */
background: #6bce29; /* Old browsers */
background: -moz-linear-gradient(top,  #6bce29 0%, #46b724 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #6bce29 0%,#46b724 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #6bce29 0%,#46b724 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6bce29', endColorstr='#46b724',GradientType=0 ); /* IE6-9 */
}
#org-price-box-left.bg-yellow{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f9cb22+0,edc021+100 */
background: #f9cb22; /* Old browsers */
background: -moz-linear-gradient(top,  #f9cb22 0%, #edc021 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f9cb22 0%,#edc021 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f9cb22 0%,#edc021 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9cb22', endColorstr='#edc021',GradientType=0 ); /* IE6-9 */
}
#org-price-box-left.bg-red{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e83336+0,d62e3d+100 */
background: #e83336; /* Old browsers */
background: -moz-linear-gradient(top,  #e83336 0%, #d62e3d 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #e83336 0%,#d62e3d 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #e83336 0%,#d62e3d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e83336', endColorstr='#d62e3d',GradientType=0 ); /* IE6-9 */
}
#org-price-box-left.bg-white{/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+1,f4f4f4+100 */
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top,  #ffffff 1%, #f4f4f4 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #ffffff 1%,#f4f4f4 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #ffffff 1%,#f4f4f4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f4f4f4',GradientType=0 ); /* IE6-9 */
}

#org-price-box-left.bg-orange{background-color: #f39923;}

#org-price-box-right.bg-blue{background-color: #dfe7ff;}
#org-price-box-right.bg-green{background-color: #f8ffe0;}
#org-price-box-right.bg-yellow{background-color: #fffadf;}
#org-price-box-right.bg-orange{background-color: #ffeed8;}
#org-price-box-right.bg-red{background-color: #ffdede;}
#org-price-box-right.bg-white{background-color: #ffffff;}
#org-price-box-right.bg-light{background-color: #f8f8f8;}

#org-price-box-right .left-box{float:left; width:48%;}
#org-price-box-right .right-box{float:right; width:48%;}
#org-price-box-right .center-box{width:100%; text-align:center;}

#org-price-box-txt-area{
	padding:5px;
	width: 95%;
	margin: 0 auto 0 auto;
}
.txt-triangle{width: 100%;margin: 10px auto 10px auto;text-align:center;}
.txt-triangle img{width: 30%;}

/* 影 */
.shadow			{box-shadow:0px 0px 3px 2px #999999;}
.shadow-gray	{box-shadow:0px 0px 3px 2px #efefef;}
.shadow-red		{box-shadow:0px 0px 3px 2px #f5e3e3;}
.shadow-blue	{box-shadow:0px 0px 3px 2px #e3f0f5;}
.shadow-green	{box-shadow:0px 0px 3px 2px #edf5e3;}
.shadow-yellow	{box-shadow:0px 0px 3px 2px #f5f4e3;}

/*マーク*/
.mark-green-gradation {

	border:1px solid #7ecc2a;
	background: rgb(161,201,68); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(161,201,68,1) 0%, rgba(98,183,53,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(161,201,68,1) 0%,rgba(98,183,53,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(161,201,68,1) 0%,rgba(98,183,53,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a1c944', endColorstr='#62b735',GradientType=1 ); /* IE6-9 */
	font-weight: 700;
	color:#ffffff;
	padding:1px 3px 1px 3px;
	margin:3px 0 3px 0;
}
.mark-yellow-gradation {

	border:1px solid #dcc635;
	background: rgb(224,209,76); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(224,209,76,1) 0%, rgba(198,182,57,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(224,209,76,1) 0%,rgba(198,182,57,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(224,209,76,1) 0%,rgba(198,182,57,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0d14c', endColorstr='#c6b639',GradientType=1 ); /* IE6-9 */
	font-weight: 700;
	color:#ffffff;
	padding:1px 3px 1px 3px;
	margin:3px 0 3px 0;
}
.mark-gray-gradation {

	border:1px solid #cccccc;
	background: rgb(173,173,173); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(173,173,173,1) 0%, rgba(140,140,140,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(173,173,173,1) 0%,rgba(140,140,140,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(173,173,173,1) 0%,rgba(140,140,140,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#adadad', endColorstr='#8c8c8c',GradientType=1 ); /* IE6-9 */
	font-weight: 700;
	color:#ffffff;
	padding:1px 3px 1px 3px;
	margin:3px 0 3px 0;
}
.mark-blue-gradation {

	border:1px solid #14a6c0;
	background: rgb(71,209,237); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(71,209,237,1) 0%, rgba(13,149,198,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(71,209,237,1) 0%,rgba(13,149,198,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(71,209,237,1) 0%,rgba(13,149,198,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#47d1ed', endColorstr='#0d95c6',GradientType=1 ); /* IE6-9 */
	font-weight: 700;
	color:#ffffff;
	padding:1px 3px 1px 3px;
	margin:3px 0 3px 0;
}
.mark-red-gradation {

	border:1px solid #c93434;
	background: rgb(201,60,60); /* Old browsers */
	background: -moz-linear-gradient(left, rgba(201,60,60,1) 0%, rgba(178,12,12,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(201,60,60,1) 0%,rgba(178,12,12,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(201,60,60,1) 0%,rgba(178,12,12,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c93c3c', endColorstr='#b20c0c',GradientType=1 ); /* IE6-9 */
	font-weight: 700;
	color:#ffffff;
	padding:1px 3px 1px 3px;
	margin:3px 0 3px 0;
}

/*ボタン*/
.my-button-org{
     display:block;
     line-height: 40px;
     color: #ffffff !important;
     font-weight: 700;
     text-decoration: none;
     text-align: center;
     background-color: #f39800; /*ボタン色*/
     border-bottom: solid 6px #ec6c00; /*下線色*/
     border-radius: 5px; /*角丸*/
     transition: all 0.3s;
}
.my-button-org:hover{
     background-color: #f9c500;/*ボタン色*/
     border-bottom: solid 6px #f39800; /*下線色*/
     -webkit-transform: translateY(6px);/*下移動*/
     transform: translateY(6px);
}
.my-button-org:active {
     margin-top: 6px;
     border-bottom: none;
}

.my-button-blue{
     display:block;
     line-height: 40px;
     color: #ffffff !important;
     font-weight: 700;
     text-decoration: none;
     text-align: center;
     background-color: #0cbcf6; /*ボタン色*/
     border-bottom: solid 6px #00a9e0; /*下線色*/
     border-radius: 5px; /*角丸*/
     transition: all 0.3s;
}
.my-button-blue:hover{
     background-color: #2cd0ff;/*ボタン色*/
     border-bottom: solid 6px #0cbcf6; /*下線色*/
     -webkit-transform: translateY(6px);/*下移動*/
     transform: translateY(6px);
}
.my-button-blue:active {
     margin-top: 6px;
     border-bottom: none;
}

/* 図形 */
.shapes_triangle_red{
  width:20px;
  margin:0 auto 0 auto;
  border-top: 40px solid #f06767;
  border-right: 40px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 40px solid transparent;
}

/* 表示非表示 */
.hidden_box {
	width:100%;
	margin: 2em 0;/*前後の余白*/
	padding: 0;
}
.hidden_box label {
	width:100%;
	padding: 15px;
	font-weight: bold;
	border: solid 2px black;
	cursor :pointer;
}
.hidden_box label:hover {
	width:100%;
	background: #efefef;
}
.hidden_box input {
	width:100%;
	display: none;
}
.hidden_box .hidden_show {
	height: 0;
	padding: 0;
	overflow: hidden;
	opacity: 0;
	transition: 0.8s;
}
.hidden_box input:checked ~ .hidden_show {
	padding: 10px 0;
	height: auto;
	opacity: 1;
}

/* ===================================================================================================== */
/* 注目コンテンツ
*/

/* 左box */
.attention-box-left{
	float:left;
	vertical-align:middle;
	width: 40% !important;
	height:95px;
	margin:0 0 0 0;
}
.attention-box-left-long{
	float:left;
	vertical-align:middle;
	width: 40% !important;
	height:120px;
	margin:0 0 0 0;
}

/* 右box */
.attention-box-right{
	float:right;
	vertical-align:middle;
	width: 60% !important;
	height:95px;
}
.attention-box-right-long{
	float:right;
	vertical-align:middle;
	width: 60% !important;
	height:120px;
}

/* フルbox */
.attention-box-full{
	vertical-align:middle;
	width: 100% !important;
	margin:0 0 0 0;
}

/* フルbox */
.attention-box-full-top{
	vertical-align:middle;
	width: 100% !important;
	margin:0 0 0 0 !important;
}

/* フルbox */
.attention-box-full-middle{
	vertical-align:middle;
	width: 100% !important;
	margin:0 0 0 0 !important;
}

/* フルbox */
.attention-box-full-bottom{
	vertical-align:middle;
	width: 100% !important;
	margin:0 0 0 0;
}

/* 右box 位置 */
.attention-box-right .left-box{float:left; width:48%;}
.attention-box-right .right-box{float:right; width:48%;}
.attention-box-right .center-box{width:100%; text-align:center;}

/* テキストエリア */
.attention-box-txt-area{
	padding:5px;
	width: 95%;
	margin: 0 auto 0 auto;
}