@charset "UTF-8";

/*
Theme Name: Twenty Twenty-One
Theme URI: https://wordpress.org/themes/twentytwentyone/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Requires at least: 5.3
Tested up to: 6.9
Requires PHP: 5.6
Version: 2.7
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyone
Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, blog, portfolio

Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org
Twenty Twenty-One is distributed under the terms of the GNU GPL.
*/


*, *::before, *::after { box-sizing: border-box; }

html, body { overflow-x: hidden; position: relative; width: 100%; }
body { margin:0; padding:0; font-size:0.9em; letter-spacing:1px; line-height:1.4em; color:#444; font-family: -apple-system, blinkMacSystemFont,'Helvetica Neue','Segoe UI',YuGothicM,YuGothic,Meiryo,sans-serif; background:#fff; }
ul { margin:0 auto; padding:0; list-style-type:none; }
.clearfix::after { content: ""; display: block; clear: both; }

header { margin:0; padding:0; width:100%; background:#000; box-sizing:border-box; display:block; }
header ul { width:95%; display:flex; justify-content: space-between; align-items:center; }
header ul li { align-items:center; }
header ul li p { margin:0; padding:0; }
header ul li p a { text-decoration:none; color:#fff; font-size:13.5px; }
header ul li.ulil { width:25%; align-items:center; }
header ul li.ulil h1 { margin:0; padding:0; }
header ul li.ulil h1 a { margin:0; padding:0; }
header ul li.ulil h1 a img { margin:0 auto; width:160px; height:35px; }
header ul li.ulir { width:65%; display:flex; justify-content: space-around; }
header ul li.ulir p { width:20%; text-align:center; }
header ul li.ulir p a { margin:0; padding:50px 0; display:block; }
header img { margin:0 auto; padding:0; width:100%; height:auto; }

.obi { margin:0 auto; padding:0; max-width:95%; width:1100px; display:block; }
div.com001 { margin:5% auto 0; padding:3%; border:1px solid #ccc; width:100%; box-sizing:border-box; text-align:left; }
div.com001 h3 { margin:0 0 2% 0; font-size:1.2rem; line-height:130%; color:#000; display:block; }
div.com001 img { margin:0 auto 3%; width:90%; height:auto;; display:block;  }
div.com001 p { font-size:0.9rem; color:#444; font-weight:normal; line-height:160%; }


#bred { margin:0.5em auto; padding:0.5em 0.5em 0 2em; border-bottom:1px solid #ccc; font-size:0.9em; }
h3.des { margin:50px auto 0 auto; width:100%; position:relative; display:inline-block; font-size:1.4em; color:#000; letter-spacing:2px; text-align:center; font-family: "M PLUS Rounded 1c"; font-weight:normal; }
h3.des:before { content: ''; position: absolute; bottom: -15px; display: inline-block; width: 60px; height: 5px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); background-color: black;  border-radius: 2px; }
#Main { margin:0 auto; padding:0 3em; }
.section { padding:30px 0; }
.demo0 .prvdiv { margin:0 auto 30px auto; padding:0; width:90%;  }
.demo0 .prvdiv h5.h5tit { color:#000; font-size:1.3em; font-weight:bold; }

.demo0 { margin:0 auto; padding:1.2em; width:100%; }
.demo0 table { margin:0 auto 4em auto; padding:0; width:100%; }
.demo0 table , td, th { border: 1px solid #595959; border-collapse: collapse; }
.demo0 td, th { padding: 0.8em; height:auto; }
.demo0 th { padding: 0.8em; text-align:center; background:#b2e1ff; }
.demo0 .even { background: #fff3e1; text-align:center; }
.demo0 .odd { background: #fefcf9; }
.demo0 .prvdiv { margin:0 auto 30px auto; padding:0; width:90%;  }
.demo0 .prvdiv h5.h5tit { color:#000; font-size:1.3em; font-weight:bold; }
.white-bg { background-color:#fff; }

.section-title { text-align: center; margin-bottom: 3rem; font-weight:normal; }
.section-title small { color: #8a909b; }

.demo0 dl { margin:0 auto; padding:0; width:90%; display:block; }
.demo0 dl dd { margin:0 0 1.5em 0; padding:0 0 1.5em 0; border-bottom:1px solid #e7e7e7; display:flex; justify-content:space-between; flex-wrap:wrap; }
.demo0 dl dd p { margin:0; padding:0; }
.demo0 dl dd p.pl { width:20%; font-weight:bold; color:#000; }
.demo0 dl dd p.pr { width:75%; }
.demo0 dl dd p.pr input { margin:0; padding:1em; border:1px solid #e7e7e7; font-size:0.9em; width:90%; }
.demo0 dl dd p.pr span.mwform-tel-field input { width:20%; }
.demo0 dl dd p.pr textarea { margin:0; padding:1em; border:1px solid #e7e7e7; font-size:0.9em; width:90%; }
p.mailbutp { margin:20px 0; padding:0 30%; text-align:center; }
input.mailbut { margin:0 auto; cursor: pointer; display: block; width:300px; height:60px; border:1px solid #ccc; text-indent: -9999px; background: url("./images/mailbut_off.gif") no-repeat 0 0; }

ul.prul { margin:0 auto; padding:0; width:100%; display:flex; justify-content:space-between; flex-wrap:wrap; }
ul.prul li { margin:0 auto; padding:0; width:50%; box-sizing:border-box; }
ul.prul li div { margin:0 0 4%; padding:0 0 4%; border-bottom:1px solid #ccc; }
ul.prul li div:last-child { border-bottom:none; }
ul.prul li div h5 { margin:0 0 1.5%; padding:0; font-size:1.5rem; font-weight:bold; color:#000; }
ul.prul li div p { margin:0 auto; width:95%; line-height:150%; }
ul.prul li img { margin:0 auto; width:60%; height:auto; display:block; }

.link_box { margin:10px auto; padding:10px 1em; width:85%; height:auto; border-bottom:1px solid #dbdbdb; display:block; }
.link_box h5.lbh4 { font-size:1.35em; font-weight:bold; color:#003dc6; letter-spacing:2px; width:90%; font-family:Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif; display:block; }
.link_box small { float:left; margin:0 0 10px 0; padding:0; width:85%; display:block; }
.link_box span { float:left; margin:0; padding:0; width:85%; display:block; }
.link_box a { width:100%; display:block; }
.link_box a small { color:#888; }
.link_box a span { color:#000; font-size:1.1em; line-height:1.3em; letter-spacing:1px; }
.link_box a:hover{ filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; }


#Foot { margin:0; padding:3em 0 0 0; background:#000; text-align:center; }
#Foot img.logo { margin:0 auto 3em auto; padding:0; display:block; }
#Foot ul { margin:0 auto; padding:0; width:980px; height:auto; border-left:1px solid #222; display:block; }
#Foot ul li { float:left; margin:0; padding:0; width:16.5%; border-right:1px solid #222; list-style-type:none; }
#Foot ul li a { margin:0; padding:1em; font-size:1em; color:#fff; text-decoration:none; display:block; }
#Foot p { margin:5em 0 0 0; font-size:0.8em; letter-spacing:4px; display:block; }


@media screen and (max-width: 767px) {
	header ul { margin:0 auto; width:97%; display:block; }
	header ul li { align-items:center; }
	header ul li p { margin:0; padding:0; }
	header ul li p a { text-decoration:none; color:#fff; font-size:13.5px; }
	header ul li.ulil { width:100%; }
	header ul li.ulil img { marign:0 auto; padding:0; width:60%; height:auto; display:block; }
	header ul li.ulir { width:100%; display:flex; justify-content: space-around; flex-wrap:wrap; }
	header ul li.ulir p { width:50%; text-align:center; display:block; }
	header ul li.ulir p a { margin:0; padding:10px 0; display:block; }
	header img { margin:0 auto; padding:0; width:100%; height:auto; display:block; }

	#Main { padding:0; width:98%; }
	ul.prul { display:block; }
	ul.prul li { width:100%; }
	ul.prul li img { margin:0 auto; width:80%; height:auto; display:block; }

	#Foot { margin:0; padding:3em 0 0 0; background:#000; text-align:center; }
	#Foot img.logo { margin:0 auto 3em auto; padding:0; display:block; }
	#Foot ul { margin:0 auto; padding:0; width:100%; height:auto; display:block; }
	#Foot ul li { margin:0; padding:0; width:100%; border-bottom:1px solid #666; text-align:left; list-style-type:none; }
	#Foot ul li a { margin:0; padding:1em; font-size:1.1em; color:#fff; text-decoration:none; display:block; }
	#Foot p { margin:5em 0 0 0; font-size:0.8em; letter-spacing:4px; }
}