/*
 Theme Name: OnePress Child
 Template: onepress
*/

/*
Theme Name:     OnePress-child
Description:    
Author:         wpmaster
Template:       onepress
 
(optional values you can add: Theme URI, Author URI, Version, License, License URI, Tags, Text Domain)
*/


 /* //////////////////////////////////////////////////////////////////////////// 
差し替え写真箇所
/////////////////////////////////////////////////////////////////////////////// */
/* ------------ frontpage location photo ----------------- */
 #about .image {
	min-height: 370px;
	background: #f5f5f5 url(http://wp2.abilityplus.co.jp/wp/wp-content/uploads/2017/08/location01.png) no-repeat center;
	background-size: cover;
}
/* ------------ page-heder photo  ----------------- */
.page-id-1643 .page-header {
	background-image: url(http://www.abilityplus.co.jp/wp/wp-content/uploads/images/page_title_pc.png);
}
.page-id-14715 .page-header {
	background-image: url(http://www.abilityplus.co.jp/wp/wp-content/uploads/images/page_title_robot.png);
}
.page-id-19177 .page-header {
	background-image: url(http://www.abilityplus.co.jp/wp/wp-content/uploads/images/page_title_programming.png);
}
.page-id-1745 .page-header {
	background-image: url(http://www.abilityplus.co.jp/wp/wp-content/uploads/images/page_title_kodopro.png);
}
.page-id-17765 .page-header {
	background-image: url(http://www.abilityplus.co.jp/wp/wp-content/uploads/images/page_title_exam.png);
}
.page-id-1565 .page-header {
	background-image: url(http://www.abilityplus.co.jp/wp/wp-content/uploads/images/page_title_support.png);
}
.page-id-1748 .page-header {
	background-image: url(http://www.abilityplus.co.jp/wp/wp-content/uploads/images/page_title_pc.png);
}
.page-id-2341 .page-header {
	background-image: url(http://www.abilityplus.co.jp/wp/wp-content/uploads/images/page_title_language.png);
}

 /* //////////////////////////////////////////////////////////////////////////// 
common style
/////////////////////////////////////////////////////////////////////////////// */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
body, h1, h2, h3, h4, h5, h6, p, a {
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, "Yu Gothic", YuGothic, Arial, Meiryo, sans-serif !important;
	letter-spacing: normal !important;
	text-transform: none !important;
}
/* IE */
@media all and (-ms-high-contrast:none) {
body, h1, h2, h3, h4, h5, h6, p, a {
	font-family: sans-serif !important;
	}
}
/* Edge */
@supports (-ms-ime-align:auto) {
body, h1, h2, h3, h4, h5, h6, p, a {
	font-family: "Yu Gothic", YuGothic, "メイリオ", Meiryo, sans-serif !important;
	}
}
html {
	font-size: 16px;
}
body {
	font-size: 1rem;
	color: #555;
	word-break: break-all;
}
h3 {
	font-size: 1.2rem;
}
p, a {
	font-weight: 400;
}
div, iframe, img, table {
	max-width: 100%;
}
strong {
	font-size: 1.2rem;
}
.section-padding {
	padding: 3rem 0px;
}
.fa-external-link {
	margin-left: 0.5em;
}
.tel {
	font-size: 2em;
}
.small {
	font-size: 90%;
	line-height: 1.25;
}
.read-text {
	max-width: 80%;
	margin: 0 auto 1rem;
	font-size: 1.2rem;
}
.align-center-pc {
	text-align: center !important;
}
.align-left-pc {
	text-align: left !important;
}
.break-pc {
	display: block !important;
}
/* ------------ header  ------------ */
#masthead .site-logo-div {
	width: 240px;
}
/* ------------ section title  ------------ */
.section-title-area {
	margin-bottom: 2rem;
}
.section-title-area .section-title {
	display: inline-block;
	border-bottom: #039be5 2px dotted;
	font-size: 1.75rem;
	font-weight: bold;
	line-height: 1.5;
}
.section-desc {
	width: 60%;
	font-size: 1.1rem;
	margin: 1.5em auto 0;
	text-align: left;
}
/* ------------ footer  ------------ */
#colophon .follow-heading {
	font-size: 1.5rem;
	margin-bottom: 4rem;
}
#colophon .footer-social .fa {
	font-size: 1.5rem;
}
#colophon .footer-social a {
	display: block;
	margin: 0;
	margin-bottom: 1rem;
	word-break: break-all;
	transition: 0.3s ease;
}
#colophon .footer-social a:hover {
	color: #fff;
	background: #90A4AE;
}
#colophon .footer-social a:first-of-type .fa:after {
	content: ' 06-6809-7583';
	font-weight: normal;
	font-size: 1.75rem;
	font-family: 'Noto Sans JP', sans-serif !important;
}
/* ====================================================
#colophon .footer-social a:nth-of-type(2) .fa:after {
	content: ' info@abilityplus.co.jp';
	font-weight: normal;
	font-size: 1.75rem;
	font-family: 'Noto Sans JP', sans-serif !important;
}
====================================================== */
#colophon .footer-social a:nth-of-type(2) .fa:after {
	content: ' Facebookページ';
	font-weight: normal;
	font-size: 1.75rem;
	font-family: 'Noto Sans JP', sans-serif !important;
}

/* ------------ sidebar  ------------ */
#secondary .widget_search label {
	width: 100%;
}
#secondary .search-submit {
	width: 100%;
}
/* ------------ .news section  ------------ */
.section-news .list-article, 
.archive .list-article, 
.blog .list-article {
	min-height: 150px;
	padding: 1rem 0;
}
.section-news .list-article-thumb, 
.archive .list-article-thumb, 
.blog .list-article-thumb {
	width: 160px;
	max-height: 120px;
	overflow: hidden;
}
.section-news .list-article-meta, 
.archive .list-article-meta, 
.blog .list-article-meta {
	margin-bottom: 0;
	font-size: 1rem;
}
.section-news .entry-title, 
.archive .entry-title, 
.blog .entry-title {
	margin-bottom: 0.25rem;
	font-size: 1.4rem;
	line-height: 1.5;
}
/* ------------ .contact section  ------------ */
.wpcf7,
.wpcf7-form {
	font-size: 1rem;
	font-weight: 600;
}
.wpcf7 span.wpcf7-list-item {
	margin: 0.5rem;
}
.wpcf7 .required {
	display: inline-block;
	padding: 1px 6px;
	margin-left: 10px;
	margin-bottom: 0.5rem;
	border-radius: 3px;
	background: #dd3333;
	color: #fff;
	font-weight: normal;
	font-size: 12px !important;
}
.wpcf7 textarea,
.wpcf7 select, 
.wpcf7 input[type="email"], 
.wpcf7 input[type="password"], 
.wpcf7 input[type="search"], 
.wpcf7 input[type="tel"], 
.wpcf7 input[type="text"], 
.wpcf7 input[type="url"], 
.wpcf7 input[type="submit"] {
	width: 100%;
	max-width: inherit;
}
.wpcf7 input[type="radio"], 
.wpcf7 input[type="checkbox"] {
	margin: 0;
}
.wpcf7 .caution {
	padding-top: 0.5rem;
	font-size: 0.9rem;
	text-align: center;
}
.wpcf7 .btn-submit {
	width: 20em;
	margin: 10px auto;
}
.wpcf7 input[type="submit"] {
	font-size: 1.1rem;
}
.wpcf7 .wpcf7-response-output {
	margin: 10px 0 0;
	padding: 8px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
.wpcf7 .wpcf7-validation-errors {
	color: #B94A48;
	background-color: #F2DEDE;
	border: 1px solid #EED3D7;
}
.wpcf7 .wpcf7-mail-sent-ok {
	color: #3A87AD;
	background-color: #D9EDF7;
	border: 1px solid #BCE8F1;
}
/* ------------ button style  ------------ */
.btn {
	padding: .75rem 1.5rem;
	border-radius: 24px;
	box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.1) inset;
	font-size: 1.2rem;
	font-weight: bold;
	color: #fff;
}
.btn:hover, .btn:active, .btn:link {
	color: #fff;
}
.btn-blue {
	background-color: rgba(3, 155, 229, 1);
	border-color: #039be5;
}
.btn-blue:hover {
	background-color: rgba(3, 155, 229, 0.6);
}
.btn-green {
	background-color: rgba(92, 184, 92, 1);
	border-color: #4cae4c;
}
.btn-green:hover {
	background-color: rgba(92, 184, 92, 0.6);
}
.btn-orange {
	background-color: rgba(245, 124, 0, 1);
	border-color: #eea236;
}
.btn-orange:hover {
	background-color: rgba(245, 124, 0, 0.6);
}

/* ////////////////////////////////////////////////////////////////////////////  
common style media queries
/////////////////////////////////////////////////////////////////////////////// */
/* ---------- 幅940px以下 ---------- */
@media screen and (max-width: 940px) {
.section-news .list-article-thumb, 
.archive .list-article-thumb, 
.blog .list-article-thumb {
	display: block;
}
#colophon .follow-heading {
	margin-bottom: 2rem;
}
#colophon .footer-social-icons {
	margin-bottom: 2rem;
}
}

/* ---------- iPadより幅狭の時 ---------- */
@media screen and (max-width: 768px) {
.section-desc {
	width: 85%;
}
.align-left-tb {
	text-align: left !important;
}
.break-tb {
	display: block !important;
}
}

/* ---------- 幅720px以下 ---------- */
@media screen and (max-width: 720px) {
.section-news .list-article-thumb, 
.archive .list-article-thumb, 
.blog .list-article-thumb {
	margin-bottom: 0.5rem;
}
}

/* ---------- 幅480px以下 ---------- */
@media screen and (max-width: 480px) {
.row {
	margin-right: 0;
	margin-left: 0;
}
.section-title-area .section-title {
	font-size: 1.25rem;
}
.section-desc {
	width: 100%;
}
.section-news .list-article-thumb, 
.archive .list-article-thumb, 
.blog .list-article-thumb {
	width: 100%;
	min-height: 180px;
	margin-bottom: 0.5rem;
}
#colophon .follow-heading {
	font-size: 1.2rem;
}
#colophon .footer-social a {
	font-size: 1.2rem;
	margin: 0;
	margin-bottom: 1rem;
}
#colophon .footer-social a:first-of-type .fa:after, 
#colophon .footer-social a:nth-of-type(2) .fa:after,
#colophon .footer-social a:nth-of-type(3) .fa:after {
	font-size: 1.2rem;
}
.btn {
	margin-bottom: 1rem;
}
.btn-orange {
	display: block;
	padding: .75rem 1rem;
	margin: 0 auto;
	font-size: 1rem;
}
.read-text {
	max-width: 90%;
	font-size: 1.1rem;
}
.break-sp {
	display: block !important;
}
.break-pc,
.break-tb {
	display: inline !important;
}
.align-left-sp {
	text-align: left !important;
}
.wpcf7 .caution {
	text-align: left;
}
}


/* ////////////////////////////////////////////////////////////////////////
navigation style
/////////////////////////////////////////////////////////////////////////// */
#site-navigation .onepress-menu a {
	padding: 0 15px;
	font-size: 14px;
	font-weight: normal;
}
#site-navigation .menu-item-has-children {
	color: #fff;
}
.onepress-menu ul li {
	line-height: 40px;
}
/* ////////////////////////////////////////////////////////////////////////////  
navigation style media queries
/////////////////////////////////////////////////////////////////////////////// */
/* ---------- 幅1200px以下 ---------- */
@media screen and (max-width: 1200px) {
#site-navigation .onepress-menu a {
	font-size: 16px;
	min-height: 3rem;
}
#site-navigation .onepress-menu a:hover {
	background: #eee;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
.main-navigation {
	position: static;
}
.main-navigation .onepress-menu {
	width: 100% !important;
	display: none;
}
.onepress-menu.onepress-menu-mobile {
	display: block !important;
	position: absolute;
	top: 75px;
	right: 0;
	width: 100%;
	background: transparent;
	z-index: 100;
	border-bottom: 1px solid #e9e9e9;
}
.onepress-menu.onepress-menu-mobile > li > a {
	padding: 12px 20px;
}
.onepress-menu.onepress-menu-mobile li ul {
	display: block !important;
}
.onepress-menu.onepress-menu-mobile li li {
	text-indent: 1rem;
}
.onepress-menu.onepress-menu-mobile li li a:before {
	content: "-";
}
.onepress-menu.onepress-menu-mobile ul {
	box-shadow: none;
	padding-bottom: 0;
	border: none;
	position: relative;
}
.onepress-menu.onepress-menu-mobile ul li:last-child {
	border-bottom: none;
}
.onepress-menu.onepress-menu-mobile ul li a {
	padding: 12px 35px;
	border-top: none;
}
.onepress-menu.onepress-menu-mobile ul li a:hover {
	background: transparent;
}
.onepress-menu.onepress-menu-mobile ul li li a {
	padding: 12px 70px;
	border-top: none;
}
.onepress-menu.onepress-menu-mobile ul li li li a {
	padding: 12px 105px;
}
.onepress-menu.onepress-menu-mobile ul ul {
	left: 0px;
}
.onepress-menu.onepress-menu-mobile li {
	line-height: 40px;
	background: #FFFFFF;
	border-top: 1px solid #e9e9e9;
	border-right: 1px solid #e9e9e9;
	border-left: 1px solid #e9e9e9;
	width: 100% !important;
}
.onepress-menu.onepress-menu-mobile li:last-child {
	border-bottom: 1px solid #e9e9e9;
}
.onepress-menu.onepress-menu-mobile li.onepress-current-item > a {
	color: #03c4eb;
}
.onepress-menu.onepress-menu-mobile a {
	color: #777777;
}
.onepress-menu.onepress-menu-mobile a:hover {
	color: #039be5;
	font-weight: bold;
}
.onepress-menu.onepress-menu-mobile .nav-toggle-subarrow {
	display: none;
}
.onepress-menu.onepress-menu-mobile .nav-toggle-dropdown > .nav-toggle-subarrow .fa-angle-down:before {
	content: "\f106" !important;
}
.onepress-menu.onepress-menu-mobile .nav-toggle-dropdown > ul {
	display: block !important;
}
#nav-toggle {
	display: block;
}
}



/* ////////////////////////////////////////////////////////////////////////////  
frontpage style
/////////////////////////////////////////////////////////////////////////////// */
.home .section-title:before, .home .section-title:after {
	content: "" !important;
}
.home .section-subtitle {
	display: block;
	color: #039be5;
	text-transform: uppercase !important;
}
.home .section-subtitle:before, .home .section-subtitle:after {
	content: ' ＋ ';
}
.home h3 {
	font-size: 1.25rem !important;
}
/* ------------ .hero section  ------------ */
#hero .hero-content-style1 h2 {
	font-size: 3.2rem;
}
#hero .hero-content-style1 p {
	font-style: normal;
	font-size: 1.25rem;
	font-weight: 400;
}
.hero__content a.btn {
	margin: 0.5rem;
}
.hero__content a.btn:hover {
	color: #039be5;
	background: #fff;
}
/* ------------ frontpage .features section  ------------ */
#features {
	background: #f5f5f5;
}
#features .feature-item h4, 
#features .feature-item h4 a {
	font-size: 1.25rem;
	color: #039be5;
}
#features .feature-item-content {
	width: 90%;
	margin: 0 auto 2em;
	text-align: left;
}
#features .feature-media, 
#features .feature-media a {
	display: inline-block;
	max-width: 225px;
	margin: 0 auto 0.5rem;
	cursor: pointer;
	transform: scale(1);
	transition: 0.3s ease;
}
#features .feature-media a:hover {
	transform: scale(1.1);
}
/* ------------ .team section  ------------ */
#team .member-thumb, #team .member-thumb a {
	display: block;
}
#team .member-thumb a:hover img {
	opacity: 0.8;
}
#team .member-info {
	width: 95%;
	max-width: 480px;
	margin: 0 auto 2rem;
	text-align: left;
}
#team .member-name {
	font-size: 1.1rem;
	text-align: center;
}
#team .member-position {
	font-size: 1rem;
	letter-spacing: normal;
}
/* ------------ .videolightbox section  ------------ */
#videolightbox {
	min-height: 320px;
}
/* ------------ .about section  ------------ */
#about .about-image {
	display: none;
}
#about .map iframe {
	height: 363px;
}
/* ------------ .contact section  ------------ */
#contact {
	background: #f5f5f5;
}
#contact .address-box {
	padding: 2em;
	font-size: 1rem;
}
#contact .address-content {
	font-style: normal;
}
/* ------------ .news section  ------------ */
#news .all-news a {
	background-color: rgba(3, 155, 229, 1);
}
#news .all-news a:hover {
	background-color: rgba(3, 155, 229, 0.6);
}

/* ////////////////////////////////////////////////////////////////////////////  
frontpage style media queries
/////////////////////////////////////////////////////////////////////////////// */
/* ---------- iPadより幅狭の時 ---------- */
@media screen and (max-width: 768px) {
#team .member-name {
	font-size: 0.9rem;
}
#about .image {
	min-height: 240px;
}
#about .map iframe {
	height: 233px;
}
}
/* ---------- 幅480px以下 ---------- */
@media screen and (max-width: 480px) {
#hero .hero-content-style1 h2 {
	font-size: 1.6rem;
}
#hero .hero-content-style1 p {
	font-size: 1rem;
	text-align: left;
	width: 90%;
	margin: 0 auto;
}
#team .member-name {
	font-size: 1rem;
	line-height: 1.5;
}
#about h3 {
	line-height: 1.5;
}
#about .wow {
	margin-bottom: 1rem;
}
#contact .address-box {
	padding: 0;
}
#contact .address-box h3 {
	text-align: center;
}
#contact .address-content {
	padding-left: 36px;
}
}




/* //////////////////////////////////////////////////////////////////////////// 
post style
/////////////////////////////////////////////////////////////////////////////// */
.post .entry-header .byline {
	display: none;
}
.post .attachment-post-thumbnail {
	max-width: 480px;
	margin-bottom: 2rem;
}






/* //////////////////////////////////////////////////////////////////////////// 
page style
/////////////////////////////////////////////////////////////////////////////// */
.page #primary {
	padding: 0;
}
.page .block {
	clear: both;
	padding: 1rem 0;
	margin-bottom: 2rem;
}
.page .entry-content h2 {
	font-size: 1.8rem;
	padding: 1rem 0;
	margin-bottom: 0;
	text-align: center;
	line-height: 1.5;
}
.page .entry-content h2:before, .page .entry-content h2:after {
	content: ' ＋ ';
	color: #039be5;
	font-weight: bold;
}
.page .entry-content h3 {
	margin-bottom: 0.5rem;
	text-align: center;
}
.page .entry-content dt {
	margin: 20px 0 0;
}
.page .entry-content dd {
	margin: 0 0 0 0.5rem;
}
.page .entry-content ul {
	list-style: none;
	padding-left: 0;
}
.page .entry-content th, 
.page .entry-content td {
	padding: 1rem;
	letter-spacing: normal;
	text-transform: none;
}
.page .entry-content th {
	width: 16rem;
	background: #efefef;
}
.page .entry-content td {
	font-weight: normal;
}
/* ------------ individual order ----------------- */
.support-page .entry-content h2 {
	padding-top: 0;
}
/* ====================================================
 page-header 
====================================================== */
.page-template-template-fullwidth .page-header {
	width: 100%;
	min-height: 90px;
	padding: 90px 0;
	margin-bottom: 1rem;
	background-color: #eee;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	text-align: center;
}
.page-template-template-fullwidth .page-header .entry-title {
	color: #fff;
	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.8);
	font-size: 2rem;
}
.page-template-template-fullwidth .page-header .entry-title small {
	display: block;
	margin: 0.5rem auto;
	font-weight: bold;
}
.page .title-white {
	color: #fff;
	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.8);
}
.page .title-black {
	color: #000;
	text-shadow: 1px 1px 0px rgba(255, 255, 255, 1);
}

/* ====================================================
.combination
====================================================== */
.page .combination {
	clear: both;
	margin-bottom: 2rem;
	overflow: hidden;
	text-align: center;
}
.page .combination-text, .page .combination-image {
	display: inline-block;
	margin: 0 1%;
	vertical-align: middle;
}
.page .combination-text {
	width: 60%;
	padding: 2em;
	text-align: left;
}
.page .combination-image {
	width: 35%;
}
.page .combination-title {
	margin-bottom: 1rem;
}
.page .combination-title .icon, 
.page .combination-title h3 {
	display: table-cell;
	vertical-align: middle;
	font-size: 1.5rem;
	line-height: 1.5;
	text-shadow: -2px -2px 0px #fff, 2px -2px 0px #fff, 2px 2px 0px #fff, -2px 2px 0px #fff;
}
.page .combination-title .icon {
	padding-right: 1.2rem;
}
.page .combination-title h3 {
	text-align: left;
}
.page .combination-text li {
	padding-left: 2em;
	text-indent: -0.9em;
	margin-bottom: 1rem;
}
/* IE */
@media all and (-ms-high-contrast:none) {
.page .combination-text li {
	text-indent: -0.75em;
	}
}
.page .combination-text li .fa {
	margin-right: 0.5rem;
}
/* ------------ individual order ----------------- */
.pc-page .combination-text {
	background: #FFF8E1 url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/grid_orange.png');
	border: 1px solid #E65100;
	font-size: 1.1rem;
}
.pc-page .combination-title .icon, 
.pc-page .combination-title h3, 
.pc-page .combination-text li .fa {
	color: #E65100;
}
.robot-page .combination-text {
	background: #fff url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/grid_green.png');
	border: 1px solid #00ACC1;
}
.robot-page .combination-title .icon, 
.robot-page .combination-text h3 {
	color: #00ACC1;
}
.programming-page .combination-text {
	background: #fff url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/grid_blue.png');
	border: 1px solid #1E88E5;
}
.programming-page .combination-title .icon, 
.programming-page .combination-text h3 {
	color: #1E88E5;
}
.exam-page .combination-text {
	background: #fff url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/wave_purple.png');
}
.support-page .combination-text {
	padding: 0;
}
.support-page .combination-image {
	vertical-align: top;
}
/* ====================================================
.introduction
====================================================== */
.page .introduction {
	padding-bottom: 0;
	margin-bottom: 0;
}
.page .introduction-text {
	width: 90%;
	margin: 0 auto;
	padding: 1em 3em 2em;
	font-size: 1.5rem;
	background: #f44336;
	color: #fff;
	border-radius: 20px;
}
/* ====================================================
.character
====================================================== */
.page .character {
	width: 220px;
	margin: -2rem auto 1rem;
}
/* ------------ individual order ----------------- */
.robot-page .character, .programming-page .character {
	margin-top: -2.5rem;
}
.robot-page .character2 {
	width: 250px;
}
.programming-page .character1 {
	width: 540px;
}
.programming-page .character2 {
	width: 440px;
}
/* ====================================================
.features
====================================================== */
.page .features {
	border-radius: 10px;
	text-align: center;
}
.page .features .service-logo {
	max-width: 480px;
	margin: 1rem auto;
}
.page .features-list {
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	/* margin-bottom: 2rem; */
}
.page .features .item {
	display: inline-block;
	width: 30%;
	padding: 1em;
	margin: 0.5em;
	border: solid 1px #ccc;
	background: #fff;
	text-align: left;
	vertical-align: top;
}
.page .features .thumbnail {
	margin-bottom: 1rem;
	text-align:  center;
}
.page .features .caption {
	line-height: 1.5;
}
.page .features .caption p {
	margin-bottom: 0;
}
.page .features h3 {
	margin-bottom: 0.5rem;
	text-align: justify;
	/*font-size: 1.2rem;*/
	line-height: 1.4;
}
/* ------------ individual order ----------------- */
.pc-page .features {
	background: #fff url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/stripe_yellow.png');
}
.pc-page .features .studypc-logo {
	width: 320px;
}
.robot-page .features {
	background: #fff url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/wave_green.png');
}
.robot-page .features .robot-logo {
	width: 220px;
}
.robot-page .features .item {
	margin: 0.25em;
}
.robot-page .features2 .item {
	width: 30%;
	margin: 1rem;
}
/*.robot-page .features2 .item p {
	font-size: 0.9rem;
}*/
.programming-page .features {
	background: #fff url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/stripe_blue.png');
}
.programming-page .features .tech-logo {
	width: 240px;
}
sac .programming-page .features .scratch-logo {
	width: 480px;
}
.programming-page .features .scratch-character {
	width: 220px;
}
.programming-page .features .combination-text {
	background: #fff url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/grid_blue.png');
}
/* ====================================================
.movie
====================================================== */
.page .movie {
	width: 75%;
	min-width: 300px;
	margin: 2rem auto;
}
.page .movie-item { 
	position: relative; 
	padding-bottom: 56.25%;
	height: 0; 
	overflow:hidden; 
	max-width: 100%;
} 
.page .movie-item iframe, 
.page .movie-item object, 
.page .movie-item embed {
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%; 
}

/* ====================================================
.line-up
====================================================== */
.page .line-up {
	text-align: center;
}
.page .line-up .item {
	margin-bottom: 2rem;
}
/* ====================================================
.conversion
====================================================== */
.page .conversion {
	width: 80%;
	padding: 1rem;
	margin: 0 auto;
	text-align: center;
	font-size: 1.3rem;
	border: solid 6px;
	border-radius: 45px;
}
.page .conversion h2 {
	display: inline-block;
	padding: 0.5rem;
	margin: 1.5rem auto 0.5rem;
	background: #fff;
}
.page .conversion h2:before, .page .conversion h2:after {
	content: "";
}
.page .conversion-text {
	margin-bottom: 0.5rem;
}
.page .conversion-text strong {
	font-size: 2.5rem;
	background: #fff;
	padding: 0.5rem;
	line-height: 3;
}
.page .conversion .tel {
	font-weight: bold;
}
/* ------------ individual order ----------------- */
.pc-page .conversion, .support-page .conversion {
	border-color: #f44336;
	color: #f44336;
	background: url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/stripe_wide_yellow.png');
}
.pc-page .conversion h2, .pc-page .conversion strong, .support-page .conversion h2, .support-page .conversion strong {
	color: #f44336;
}
.robot-page .conversion, .programming-page .conversion, .exam-page .conversion {
	border-color: #1E88E5;
	color: #1E88E5;
	background: url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/stripe_wide_green.png');
}
.robot-page .conversion h2, .robot-page .conversion strong, .programming-page .conversion h2, .exam-page .conversion h2, .exam-page .conversion strong {
	color: #F57C00;
}
/* ====================================================
.step-up
====================================================== */
.page .step-up .item {
	padding: 2em 4em;
	margin-bottom: 2em;
}
.page .step-up h3 {
	font-size: 1.5rem;
	line-height: 1.5;
}
/* ------------ individual order ----------------- */
.pc-page .step-up .item {
	background: url('http://www.abilityplus.co.jp/wp/wp-content/uploads/images/wave_yellow.png');
}
.pc-page .step-up .btn {
	margin-right: 1rem;
}
/* ====================================================
.photo
====================================================== */
.page .photo .photo-list {
	text-align: center;
}
.page .photo .photo-list li {
	display: inline-block;
	max-width: 30%;
	padding: 1rem;
	margin: 0.5rem;
	border: solid 1px #ddd;
	vertical-align: top;
}
/* ====================================================
.split
====================================================== */
.page .split {
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
}
.page .split-item {
	float: left;
	width: 48%;
	padding: 2rem;
	margin: 0 1%;
	border: solid 1px #ccc;
}
.page .split-item .images {
	max-width: 240px;
}
/* ====================================================
.table-style
====================================================== */
.page .table-style {
	width: 80%;
	margin: 0 auto;
	margin-bottom: 3rem;
}
.page .table-style h2 {
	margin-bottom: 0.5rem;
}
.page .table-style h3 {
	line-height: 1.5;
}
.page .table-style .price-tbl {
	margin-bottom: 0.5rem;
}
.page .table-style .price-tbl th {
	text-align: center;
}
.page .table-style .price-tbl tbody {
	text-align: right;
}
.page .table-style .table-note {
	text-align: right;
}
/* ------------ individual order ----------------- */
.programming-page .course-tbl th+td {
	width: 9rem;
}
.programming-page .course-tbl .text-cell {
	width: auto;
}
/* ====================================================
contact form
====================================================== */
.page .wpcf7 table {
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
}
.page .wpcf7 th {
	width: 40%;
	background: #FFF8E1;
	font-size: 1rem;
}
.page .wpcf7 th, .page .wpcf7 td {
	text-align: left !important;
}

/* ////////////////////////////////////////////////////////////////////////
page style media queries
/////////////////////////////////////////////////////////////////////////// */
/* ---------- 幅1200px以上 ---------- */
@media screen and (min-width: 1200px) {
	.page-template-template-fullwidth .container {
		width: auto;
		max-width: 100%;
	}
	.page-template-template-fullwidth .entry-content, 
	.page-template-template-fullwidth .site-header .container, 
	.page-template-template-fullwidth .footer-connect .container {
		width: 1140px;
		max-width: 100%;
		margin: 0 auto;
	}
	#masthead .container,
	.site-header .container {
		width: 100%;
	}
}

/* ---------- 幅1000px以下 ---------- */
@media screen and (max-width: 1000px) {
.page .split {
	display: block;
}
.page .split-item {
	float: none;
	width: 90%;
	margin: 0 auto;
	min-height: auto;
}
}
/* ---------- iPadより幅狭の時 ---------- */
@media screen and (max-width: 768px) {
.page .entry-content h2 {
	font-size: 1.5rem;
}
.page .entry-content th {
    width: 10rem;
}
.page .page-title h1 {
	padding: 30px 0;
	font-size: 1.5rem;
}
.page .page-title h1 span {
	font-size: 1rem;
}
.page .combination-text {
	width: 95%;
	padding: 1em;
	margin: 0 auto 1rem;
	font-size: 1rem;
}
.support-page .combination-text {
	width: 100%;
	padding: 0;
}
.page .combination-image {
	width: 300px;
}
.page .combination-text li {
	width: 95%;
}
.page .introduction-text {
	padding: 1em 1em 2em;
	font-size: 1.1rem;
}
.page .character {
	margin-top: -2em;
}
.page .features .item p {
	font-size: 0.9rem;
}
.robot-page .features2 .item {
	width: 46%;
}
.robot-page .features2 .features-image {
	width: 90%;
	margin: 0 auto;
}
.programming-page .features {
	margin-bottom: 1rem;
}
.programming-page .features .combination-text {
	width: 90%;
	margin: 0 auto 1rem;
}
.programming-page .features .scratch-character {
	margin-top: -2.5rem;
}
.page .conversion {
	width: 100%;
	border-radius: 30px;
	font-size: 1.1rem;
}
.page .conversion-text strong {
	font-size: 2rem;
}
.page .table-style {
	width: 100%;
}
.page .table-style {
	width: 100%;
}
.programming-page .price-tbl th+td {
	width: 20rem;
}
.page .wpcf7 th {
	width: 12em;
}
}

/* ---------- 幅480px以下 ---------- */
@media screen and (max-width: 480px) {
.page-template-template-fullwidth .page-header .entry-title {
	font-size: 1.5rem;
}
.page .entry-content h2 {
	font-size: 1.3rem;
}
.page .entry-content h2:before, .page .entry-content h2:after {
	content: "";
}
.page .combination-title .icon {
	display: block;
	padding: 0;
	text-align: center;
}
.page .combination-title .icon, 
.page .combination-title h3 {
	font-size: 1.2rem;
}
.page .combination-image {
	width: 260px;
}
.page .character {
	width: 170px;
}
.page .features .service-logo {
	width: 90%;
}
.page .features-list {
	display: block;
}
.page .features .item {
	width: 90%;
	min-height: auto;
	margin: 0.5rem 0;
}
.page .features .combination {
	margin-bottom: 0;
}
.page .photo .photo-list li {
	max-width: none;
	text-align: left;
}
.programming-page .features h2 {
	margin-bottom: 1rem;
}
.programming-page .character1, 
.programming-page .features .scratch-logo {
	width: 100%;
}
.programming-page .features .tech-logo, 
.programming-page .character2 {
	width: 80%;
}
.programming-page .features .scratch-character {
	width: 50%;
}
.page .movie {
	width: 90%;
	min-width: inherit;
}
.page .conversion {
	width: 100%;
	font-size: 1rem;
}
.page .conversion h2 {
	font-size: 1.25rem;
	width: 100%;
	margin-bottom: 1rem;
}
.page .conversion-text strong {
	display: block;
	padding: 0.5em 0;
	margin: 1rem auto 0;
	font-size: 1.25rem;
	line-height: 1.5;
}
.page .conversion .tel {
	display: inline-block;
	font-size: 1.5em;
}
.page .step-up .item {
	padding: 1rem 0.5rem;
}
.page .step-up h3 {
	font-size: 1.25rem;
}
.page .split-item {
	width: 100%;
	padding: 1rem;
}
.page .table-style h3 {
	font-size: 1.1rem;
	text-align: left;
}
.page .table-style th,
.page .table-style td {
	padding: 1rem 0.5rem;
}
.page .block-tbl-sp th,
.page .block-tbl-sp td {
	display: block;
	width: 100%;
}
.page .block-tbl-sp th+td {
	width: 100%;
}
.programming-page .price-tbl thead {
	display: none;
}
.programming-page  .price-tbl td::before {
	content: attr(data-label);
}
.page .wpcf7 table,
.page .wpcf7 th, 
.page .wpcf7 td, 
.page .wpcf7 .btn-submit, 
.page .wpcf7 input[type="submit"] {
	width: 100%;
}
.page .wpcf7 th, 
.page .wpcf7 td {
	display: block; 
}
.page .wpcf7 label {
	margin-bottom: 0;
}
}


/* Hero ボタンの境界線対策 */
#hero .hero__content a.btn,
#hero .hero__content a.btn.btn-lg {
    background-color: #00bcd4 !important;
    color: #fff !important;
    border-radius: 999px !important;
    padding: 12px 28px !important;
    border: 2px solid transparent !important; /* ← これが最重要 */
    transition: all 0.3s ease !important;
}

/* ホバー時 */
#hero .hero__content a.btn:hover,
#hero .hero__content a.btn.btn-lg:hover {
    background-color: #fff !important;
    color: #00bcd4 !important;
    border-color: #00bcd4 !important; /* ← 太さは変えない */
}

/* メニュー hover を旧 OnePress 風に復活 */
#site-navigation .onepress-menu > li > a {
    padding: 10px 18px; /* hover時にズレないように固定 */
    border-radius: 4px; /* 角丸（元サイト風） */
    transition: all 0.2s ease;
}

#site-navigation .onepress-menu > li > a:hover {
    background: #666 !important; /* 元サイトの濃いグレー */
    color: #fff !important;
}


/* Hero 内の文字ブロックを、まとめて上に持ち上げる */
#hero .hero__content {
    position: relative !important;
    top: -80px !important;   /* ← ここを -40 / -60 / -100 など好みで調整 */
}

/* ============================================================
   Hero 背景画像：下側をカットして上側だけ見せる（高さ400px版）
   ============================================================ */

/* Hero の高さを固定（背景の見える範囲を決める） */
#hero {
    height: 400px !important;          /* ← ここが決め手。背景の“枠”になる */
    overflow: hidden !important;       /* 下がはみ出さないようにする */
    background-size: cover !important; /* 枠いっぱいに拡大 */
    background-position: center top !important; /* 上基準で表示（下が切れる） */
}



/*  Hero 内のテキストブロック（タイトル＋説明＋ボタン）を
      まとめて上に持ち上げる
   （top のマイナス値を変えると上下位置を微調整できる） */
#hero .hero__content {
    position: relative !important;
    top: -80px !important;  /* ここを -60 / -100 などに変えて好みの位置に */
}

/*  念のため、タイトルと説明文の余計な上マージン・パディングを消す */
#hero .hero__content h2.hero-large-text,
#hero .hero__content p {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ============================================================
   サイト全体のタイポグラフィを元サイトのように正常化する
   ============================================================ */

/* 基本の文字サイズ・色・行間（全ページ共通） */
body {
    font-size: 16px !important;      /* 標準サイズに戻す */
    line-height: 1.6 !important;     /* 読みやすい行間 */
    color: #333 !important;          /* 落ち着いた濃グレー */
    font-weight: 400 !important;     /* 太すぎるのを防ぐ */
}

/* 見出し（h1〜h6）を控えめで上品に */
h1, h2, h3, h4, h5, h6 {
    font-weight: 600 !important;     /* 細めの強調（太すぎない） */
    color: #333 !important;
    margin-top: 0.8em !important;
    margin-bottom: 0.4em !important;
}

/* h2（セクションタイトル） */
h2 {
    font-size: 24px !important;      /* 控えめで上品な大きさ */
    letter-spacing: 0.5px !important;
}

/* h3（小見出し） */
h3 {
    font-size: 20px !important;
    font-weight: 600 !important;
}

/* 段落（p） */
p {
    font-size: 16px !important;
    line-height: 1.7 !important;
    margin-bottom: 1.2em !important;
    color: #444 !important;
}

/* セクションの上下余白を正常化（広すぎるのを修正） */
section {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

/* ============================================================
   ① Hero タイトル（元サイトと同じ白文字＋大きめ）
   ============================================================ */
#hero .hero__content h2.hero-large-text {
    font-size: 42px !important;     /* 元サイトと同等の大きさ */
    font-weight: 700 !important;
    color: #fff !important;          /* 白文字に統一 */
    line-height: 1.3 !important;
}

/* Hero 説明文（白文字で読みやすく） */
#hero .hero__content p {
    font-size: 18px !important;
    color: #fff !important;
    line-height: 1.6 !important;
}



/* ============================================================
   【about セクション専用】
   OnePress の仕様に合わせつつ、元サイトの見た目に寄せる調整
   - サブタイトル（Our Location）＝小さめ・青色・上
   - タイトル（通いやすい…）＝大きめ・黒・下
   ============================================================ */


/* ------------------------------------------------------------
   サブタイトル（Our Location）
   → OnePress では「上に表示される小さい文字」
   → 元サイトのように青色＆控えめサイズに調整
   ------------------------------------------------------------ */
#about .section-subtitle {
    color: #4fc3f7 !important;     /* 明るめの水色（好感度高い色） */
    font-size: 18px !important;    /* 控えめなサイズ */
    font-weight: 600 !important;   /* 少し強調 */
    text-align: center !important; /* 中央揃え */
    margin-bottom: 6px !important; /* 下のタイトルとの間隔 */
}


/* ============================================================
   【about セクション専用】
   タイトル（通いやすい…）の背景点線を消して、
   短い水色の点線を自作して付け直す
   ============================================================ */

/* タイトル本体 */
#about h3.section-title {
    font-size: 30px !important;
    font-weight: 700 !important;
    color: #333 !important;
    text-align: center !important;
    margin-bottom: 15px !important;

}


/* タイトル（通いやすい…）の下線を完全に消す */
#about h2.section-title {
    border: none !important;        /* ← これが本体 */
    background: none !important;    /* 念のため背景も消す */
    box-shadow: none !important;    /* テーマによっては影で線を描く場合もある */
}

/* ============================================================
   【about セクション専用】
   タイトル（通いやすい…）の下に “短い水色の点線” を付ける
   - 元テーマの長い線はすでに削除済み
   - ここでは新しく短い線を自作して追加する
   ============================================================ */

/* ============================================================
   【about セクション専用】
   タイトル（通いやすい…）の下に “短い水色の点線” を付ける
   - 元テーマの長い線は削除済み
   - ここで新しく短い線を追加する
   - width を変えるだけで長さを自由に調整できる
   ============================================================ */

/* タイトル本体（点線を配置するための土台） */
#about h2.section-title {
    position: relative;              /* 疑似要素を正しく配置するため */
    text-align: center;              /* 点線を中央揃えにするため */
    margin-bottom: 15px;             /* 下の文章との余白 */
}

/* タイトルの下に短い水色の点線を追加 */
#about h2.section-title::after {
    content: "";                     /* 疑似要素を表示するための必須設定 */
    display: block;                  /* 横幅を指定して中央に配置するため */
    width: 360px;                     /* ← ★ 点線の長さ（ここを調整） */
                                     /* 40px → 短い / 80px → 中くらい / 120px → 長め */
    border-bottom: 2px dotted #4fc3f7; /* 水色の点線 */
    margin: 10px auto 0 auto;        /* 上に余白を入れつつ中央寄せ */
}





/* 本文（読みやすい標準サイズ） */
#location p {
    font-size: 16px !important;
    line-height: 1.7 !important;
    color: #444 !important;
    text-align: center !important;
    max-width: 800px;
    margin: 0 auto 20px auto !important;
}

/* about セクションのタイトル行を縦並びにする */
#about .section-header {
    display: block !important;      /* いったん素直なブロックに戻す */
    text-align: center !important;
}

/* サブタイトル（Our Location）を1行で上に */
#about .section-subtitle {
    display: block !important;      /* 横並びをやめて1行占有 */
    float: none !important;         /* テーマの float 指定を打ち消す */
    margin-bottom: 6px !important;
}

/* タイトル（通いやすい…）をその下に1行で */
#about .section-title {
    display: block !important;
    float: none !important;
    margin-bottom: 15px !important;
}