@charset "UTF-8";

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
  font-family: Hiragino Kaku Gothic ProN,Yu Gothic,YuGothic,Meiryo,sans-serif;}

picture img{width: 100%;}
.call-to-action {background: url("../images/bg-toppage.jpg") no-repeat center center;}
.bg-light {background-color: unset !important;}

.navbar > .container {justify-content: center;}
header.masthead h1, header.masthead .h1 {font-size: 1.75rem;}
.title-text img{width: 100%;}
h1.soudan span{font-size: 0.8em;display: block;color:#333;}
.showcase .showcase-img {background-position: center;}

.about{padding-top: 12em;margin-bottom: -6em;}
tr, td, th{padding: 0.5em;}
.foot-logo{float: right;position: relative;bottom: 160px;width: 150px;}
iframe {width: 100%;aspect-ratio: 16/9;margin-top: -9em;}

.title-text{color:#21215a;text-align: left;margin-bottom: 2rem;}
.br-pc{display: none;}
.br-sp{display: block;}

p {text-align: left;}

@media (min-width: 1200px){
.main-catch, .foot-catch {width: 70%;}
}
@media (min-width: 768px){
.navbar > .container {justify-content: space-between;}
header.masthead h1, header.masthead .h1 {font-size: 2.8rem;}
.br-pc{display: block;}
.br-sp{display: none;}
}

@media (max-width: 480px){
header.masthead h1, header.masthead .h1 {font-size: 1.4rem;}
.foot-logo{bottom: 120px;width: 100px;}
}


.bg-stripe {
background-size: auto auto;
background-color: rgba(255, 255, 255, 1);
background-image: repeating-linear-gradient(135deg, transparent, transparent 3px, rgba(255, 243, 184, 1) 3px, rgba(255, 243, 184, 1) 6px );
}

/* 4box */
.card_4box{height: auto;position: relative;margin-bottom: 2rem}
.cards_box_round {
    margin-top: 0;
    background: #fff;/*背景色*/
    color: #333;/*文字色*/
    border: solid 1px #21215a;
    border-radius:  0 0 15px 15px;
}
.cards_box_title { 
    padding: 0.5em 0.5em 0.4em 3.25em;
    font-size: 1.3em;/*タイトル文字サイズ*/
    background: #21215a;/*タイトル文字背景色*/
    border-bottom: 3px solid #006ab7;/*タイトル下線*/
    color: #ffffff;/*タイトル文字色*/
    font-weight: bold;
    line-height: 1.1;
    letter-spacing: 0.05em;
    text-align: left;
    height: 85px;
    display: flex;
    align-items: center;
}
.cards_box_round p {margin-bottom: 0;padding: 1rem;}
.cards_box_title p {padding: 0;}
.img-left{width: 200px;float: left;margin-right: 1rem;}
.img-right{width: 200px;float: right;margin-left: 1rem;}
.img-large{width: 280px;}

/* number ribbon */
.cp_ribbon {
	line-height: 50px;
	position: absolute;
	top: 17.5px;
	left: 0;
	width: 60px;
	height: 50px;
	padding-left: 15px;
	color: #ffffff;
	background: #006ab7;
}
.cp_ribbon:before, .cp_ribbon:after {
	position: absolute;
	content: '';
}
.cp_ribbon:after {
	right: -15px;
	width: 0;
	height: 0;
	border-top: 25px solid transparent;
	border-bottom: 25px solid transparent;
	border-left: 15px solid #006ab7;
}
.cp_ribbon span{font-size: 1.75rem;font-weight: bold;}


/* 6box */
.card_6box{display: flex;position: relative;margin-bottom: 2rem}
.cards_box_square {margin-top: 0;background: #fff;color: #333;border: solid 1px #21215a;}
.cards_box_square p {margin-bottom: 0;padding: 1rem;}
.cards_box_square .cards_box_title p {padding: 1rem 0 1rem 1rem;}
.card_6box .cards_box_title {padding: 0.5em 0 0.4em 1.75em; font-size: 1.25em;}
.card_6box .cp_ribbon {line-height: 40px;top: 22px;width: 40px;height: 40px;}
.card_6box .cp_ribbon:after{border-top: 20px solid transparent;border-bottom: 20px solid transparent;}

@media (max-width: 990px){
.img-large{width: 200px;}
}
@media (max-width: 480px){
.cp_ribbon {padding-left: 13px;}
.cp_ribbon:after {right: -13px;border-left: 13px solid #006ab7;}
}