@charset "UTF-8";
/*
Theme Name: Emanon Premium child
Theme URI: https://wp-emanon.jp/emanon-premium/
Author: 株式会社イノ・コード
Author URI: https://innocord.co.jp/
Description: Emanon Premiumnの子テーマです。
Template: emanon-premium
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags:one-column, two-columns, three-columns, left-sidebar, right-sidebar, theme-options
*/
/*フォント指定*/
/*通常の本文*/
これは Zen Maru Gothic です。
これは Roboto です。
これは M PLUS 1 です。
/*コンタクトフォームの装飾*/
.cf7__list {
display: flex;
flex-wrap: wrap;
margin-bottom: 60px;
}
.cf7__list dt,
.cf7__list dd {
margin-top: 30px;
}
.cf7__list dt {
width: 35%;
padding-top: 15px;
}
.cf7__list dd {
width: 65%;
}
/* 必須・任意 */
.cf7__required,
.cf7__optional {
margin-right: 15px;
padding: 6px 14px;
color: #fff;
font-size: 12px;
vertical-align: 1px;
}
.cf7__required {
background: #1dbe90;
}
.cf7__optional {
background: #878D8E;
}
/* input・textarea */
.cf7__list dd input[type="text"],
.cf7__list dd input[type="tel"],
.cf7__list dd input[type="email"],
.cf7__list dd textarea {
width: 100%;
padding: 15px 20px;
background: #F4F4F4;
}
/* チェックボックス・ラジオボタン */
.cf7__list dd .wpcf7-checkbox,
.cf7__list dd .wpcf7-radio {
display: block;
padding: 15px 0 10px;
}
/* 縦並び（チェックボックス・ラジオボタン） */
.cf7__list dd .wpcf7-list-item {
display: block;
margin: 0;
}
.cf7__list dd .wpcf7-list-item:nth-child(n + 2) {
margin-top: 18px;
}
/* マウスカーソル（チェックボックス・ラジオボタン） */
.cf7__list dd .wpcf7-list-item label {
cursor: pointer;
}
/* チェックボックス・ラジオボタン */
input[type="checkbox"],
input[type="radio"] {
position: relative;
width: 18px;
height: 18px;
margin-right: 8px;
border: 1px solid #bcbcbc;
vertical-align: -3px;
cursor: pointer;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
/* チェックボックス */
input[type="checkbox"]:checked {
border: 1px solid #000;
background: #000;
}
input[type="checkbox"]:checked:before {
position: absolute;
top: 2px;
left: 5px;
transform: rotate(50deg);
width: 6px;
height: 10px;
border-right: 2px solid #fff;
border-bottom: 2px solid #fff;
content: '';
}
/* ラジオボタン */
input[type="radio"] {
border-radius: 50%;
}
input[type="radio"]:checked:before {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 9px;
height: 9px;
border-radius: 50%;
background: #000;
content: '';
}
/* プレースホルダー */
/* Google Chrome / Safari / Mozilla Firefox / Opera */
.cf7__list dd input[type="text"]::placeholder,
.cf7__list dd input[type="tel"]::placeholder,
.cf7__list dd input[type="email"]::placeholder,
.cf7__list dd textarea::placeholder {
color: #a5a5a5;
}
/* Microsoft Edge */
.cf7__list dd input[type="text"]::-ms-input-placeholder,
.cf7__list dd input[type="tel"]::-ms-input-placeholder,
.cf7__list dd input[type="email"]::-ms-input-placeholder,
.cf7__list dd textarea::-ms-input-placeholder {
color: #a5a5a5;
}
/* Internet Explorer */
.cf7__list dd input[type="text"]:-ms-input-placeholder,
.cf7__list dd input[type="tel"]:-ms-input-placeholder,
.cf7__list dd input[type="email"]:-ms-input-placeholder,
.cf7__list dd textarea:-ms-input-placeholder {
color: #a5a5a5;
}
/* 送信ボタン */
.cf7__button {
padding-left: 0;
text-align: left;
margin-top: 40px; /* 行間調整 */
}
input[type="submit"] {
display: inline-block;
}
input[type="submit"] {
width: 260px;
height: 60px;
background: #000;
color: #fff;
transition: opacity .6s;
}
input[type="submit"]:hover {
opacity: .6;
}
/* ajax-loader */
.wpcf7-spinner {
vertical-align: middle;
}
@media screen and (max-width: 767px) {
.cf7__list dt {
width: 100%;
margin-bottom: 15px;
padding-top: 0;
}
.cf7__list dd {
width: 100%;
}
.cf7__list dd:nth-of-type(n + 2) {
margin-top: 0;
}
.cf7__list dd .wpcf7-checkbox,
.cf7__list dd .wpcf7-radio {
padding: 15px 0 0;
}
/* 送信ボタン */
input[type="submit"] {
width: 180px;
height: 56px;
}
}
/* お問い合わせフォーム全体の行間を広げる */
.cf7__list dt,
.cf7__list dd,
.cf7__list label,
.cf7__list input[type="text"],
.cf7__list input[type="tel"],
.cf7__list input[type="email"],
.cf7__list textarea {
line-height: 1.8; /* または 2.0 や px 指定も可 */
}
/* チェックボックス項目のラベル行間も調整 */
.cf7__list dd .wpcf7-list-item label {
line-height: 1.8;
}
/*-------- 色指定 ---------*/
:root {
--f-text: #473f35; /* 文字の色 */
--f-line: #6fba45; /* 線の色 */
--f-bg1: #6edb8b; /* タイトル行の背景色 */
--f-bg2: #d0f2bd; /* ストライプの背景色 */
}
.fem-table table {
width: 100%;
color: var(--f-text);
text-align: right;
border: 2px solid var(--f-line);
background-color: white;
border-collapse: collapse;
}
.fem-table table th,
.fem-table table td {
padding: 10px;
border: 1px dotted var(--f-line);
text-align: right;
}
.fem-table table th {
background-color: var(--f-bg1);
color: white;
}
.fem-table table tr:nth-child(even) {
background-color: var(--f-bg2);
}
.fem-table table thead {
border-bottom: 1px solid var(--f-line);
background-color: var(--f-bg1);
color: white;
}
/* モバイル対応（画面幅767px以下） */
@media screen and (max-width: 767px) {
.fem-table table {
font-size: 14px;
}
.fem-table table th,
.fem-table table td {
padding: 8px;
}
}