@media (max-width:1630px){
.hero-slide:first-child .hero-text {
    	margin-left: 200px;
}
.hero-slide:first-child::after {
    	left: 15%;
}
}

@media (max-width:1500px){
.hero-slide:first-child::after {
    	left: 5%;
}
.hero-slide:first-child .hero-text {
        margin-left: 170px;
}
.hero-slide{
	background-position:center;
}
}

@media (max-width:1200px){
.hero-slide:first-child::after {
    	width: 500px;
    	height: 600px;
}
.l-nav{
  	display:none;
  	position:absolute;
  	top:80px;
  	left:0;
  	width:100%;
  	background:#fff;
}
.l-nav.active{
  	display:block;
}

.hamburger{
  	display:block;
  	width:30px;
  	height:22px;
  	position:relative;
  	background:none;
  	border:none;
}
.hamburger span{
  	position:absolute;
  	width:100%;
  	height:2px;
  	background:#333;
  	left:0;
  	transition:0.3s;
}
.hamburger span:nth-child(1){
  	top:0;
}
.hamburger span:nth-child(2){
  	top:10px;
}
.hamburger span:nth-child(3){
  	bottom:0;
}
.hamburger.active span:nth-child(1){
  	top:10px;
  	transform:rotate(45deg);
}
.hamburger.active span:nth-child(2){
  	opacity:0;
}
.hamburger.active span:nth-child(3){
  	top:10px;
  	transform:rotate(-45deg);
}
.nav-list {
    	padding: 20px;
 	background:rgba(252, 248, 243, 0.9);
	font-size:15px;
	white-space:nowrap;
}
.envelope {
    	width: 350px;
    	height: 250px;
}
img.flying-photo {
    	width: 150px;
    	height: 150px;
}
.envelope-body::before {
    	border-left: 170px solid transparent;
    	border-right: 170px solid transparent;
	left:5px;
}
.envelope-body h2 {
    	font-size: 32px;
}
.envelope a {
   	 padding-top: 30px;
}
.photo1 {
    	left: 30px;
}
.photo2 {
    	left: 100px;
}
.photo3 {
    	left: 170px;
}
.photo4 {
    	left: 0;
}
.photo5 {
    	left: 90px;
}
.photo6 {
    	left: 200px;
}
.envelope-desc {
    	font-size: 16px;
}
}

@media (max-width:1100px){
.hero-slide:first-child::after {
    	left:-30px;
}
.hero-slide:first-child .hero-text {
        margin-left: 150px;
}
}

@media (max-width:1100px){
.crosstalk-label01 {
    	left: 32%;
    	font-size: 30px;
}
.crosstalk-label {
    	left: 46%;
    	font-size: 18px;
}
.crosstalk-label03 {
    	left: 50%;
    	font-size: 18px;
}
.crosstalk-btn {
    	padding: 7px 38px;
}
.crosstalk-btn01 {
    	bottom: 30px;
}
}

@media (max-width:1050px){
.hero-slide:first-child::after {
    	left:0;
}
.hero-slide:first-child .hero-text {
        margin-left: 100px;
}
.hero-slide h1 {
    	font-size: 28px;
	line-height:1.4;
	margin-bottom:30px;
	margin-top:70px;
}
.hero-slide p{
    	font-size: 17px;
	line-height:1.5;
	margin-bottom:30px;
}
.hero-slide.active {
    	background-position: center center;
}
.cta-buttons-hero {
    	flex-direction: column;
 	gap:15px;
    	margin-left: 0;
	align-items:center;
}
.cta-buttons-hero {
    	flex-direction: column;
    	margin-left: 0;
	max-width:100%;
	gap:20px;
}
.hero-text{
	min-width:auto;
	width:100%;
	padding:15px 0;
}
.btn-hero{
	width:300px;
}
.btn-hero .entry-main {
    	font-size: 22px;
}
.btn-hero .entry-sub {
    	font-size: 14px;
}
.sp-br{
	display:block;
}


}

@media (max-width:950px){
.entry-main {
    	font-size: 30px;
}
.entry-sub {
    	font-size: 16px;
}
.btn-outline-new {
	font-size:18px;
}
}

@media (max-width: 860px) {
.hero-slide:first-child .hero-text {
        margin-left: 170px;
}
}

@media (max-width: 768px) {
body{
	padding-top:75px;
}
.inner {
    	padding: 0 20px;
}
a.l-header-logo__link {
    width: 120px;
    height: auto;
}
.l-header{
	padding:10px 0;
}
.sp-entry{
  	display:block;
}
.sp-entry a{
  	display:block;
  	text-align:center;
  	border:1px solid #4FC3F7;
  	color:#4FC3F7;
  
  	padding:12px;
  	border-radius:10px;
  	margin:10px 20px;
  	font-weight:bold;
  	position:relative;
  	overflow:hidden;
  	box-shadow:0 8px 20px rgba(0,0,0,0.15);
 	transition:all 0.2s ease;
}
.sp-entry a::before{
  	content:"";
  	position:absolute;
  	top:0;
  	left:0;
  	width:100%;
  	height:55%;

  	background:linear-gradient(
   	to bottom,
    	rgba(255,255,255,0.35),
    	rgba(255,255,255,0.05),
    	rgba(255,255,255,0)
  	);

  	border-radius:10px 10px 0 0;
  	pointer-events:none;
}
.sp-entry a:active{
  	transform:translateY(3px);
  	box-shadow:0 4px 10px rgba(0,0,0,0.15);
}
.sp-entry a::after{
  	content:"\2192";
  	position:absolute;
  	right:18px;
  	top:50%;
  	transform:translateY(-50%);
  	font-size:18px;
}
.entry-btn {
    	font-size: 15px;
}
.c_name {
    	font-size: 28px;
}
.entry-wrapper:hover .entry-dropdown{
  	display:block;
}
.l-header-logo__link {
    	gap: 0;
}
.l-nav{
	right:0;
	top:74px;
}
.nav-list{
	flex-direction:column;
	line-height:3;
}
.nav-list li::after{
	display:none;
}
.l-nav.active {
        width: 100%;
}
.header-right {
    	flex-direction: row-reverse;
}
h2.section-title {
    	font-size: 40px;
}
.message-paper {
  	background-image: repeating-linear-gradient(
    	to bottom,
    	transparent 0px,
    	transparent 29px,
    	#ccc 30px
  	);
  	background-size: 100% 30px; /* 横幅は100% */
}
.section-header {
    	margin-bottom: 30px;
}
.message-paper {
   	padding: 5px 20px;
	margin-bottom: 50px;
	transform:rotate(0);
}
.message-paper p {
        font-size: 14px;
        line-height: 2.2;
	margin-bottom:12px;
}
.message-p2 {
    	margin-top: 13px;
}
.message-p3 {
    	margin-top: 10px;
}
.message-p4 {
    	margin-top: 0;
}
img.paper-logo {
    	width: 50px;
	bottom:10px;
	right:5px;
}
.news {
    	padding-top: 0 !important;
}
.btn{
	padding:15px 80px;
}
.news-list{
	margin-bottom:0;
}
.news-list {
    	grid-template-columns: repeat(1, 1fr);
}
section.company-overview {
    	padding-top: 0;
}
.news-card {
    	flex: 1 1 100%;
    	max-width: 100%;
}
.work-links{
	padding-top:0;
}
.ohana-split{
	background: linear-gradient(rgba(248, 243, 235, 0.9), rgba(248, 243, 235, 0.9)), url(../images/note-sp.jpg);
	background-repeat:no-repeat;
	grid-template-columns: 1fr;
	padding: 50px 30px;
	background-size:100% 100%;
	padding-top: 30px;
    	gap: 100px;
}
.ohana-photo {
    	width: 80%;
}
.ohana-title {
    	font-size: 20px;
}
.ohana-btn {
    	padding: 6px 40px;
}

.envelope-1 {
    	top: 45%;
    	left: 55%;
}
.envelope-2 {
    	top: 77%;
    	left: 36%;
}
.envelope-1:hover {
  	display:none;
}
.envelope-2:hover {
  	display;none;
}
.people {
    	padding: 0;
}
.talk-02{
	margin-top:50px;
}
.crosstalk-title-image img {
    	width: 60%;
    	opacity: 0.7;
}
.crosstalk-text {
    	left: 24%;
    	font-size: 24px;
}
.crosstalk-card {
    	flex-direction: column;
}
.crosstalk-right {
    	flex-direction: column;
	margin-left:0;
}
.crosstalk-label01 {
    	left: 50%;
	top:0;
}
.crosstalk-label01 {
    	font-size: 26px;
}
.crosstalk-label {
    	font-size: 18px;
	left:50%;
	top:0;
}
.crosstalk-label03 {
        top: 0;
}
.faq {
    	padding: 0 20px;
}
.faq-question {
    	font-size: 20px;
	padding:10px;
}
.faq-q {
    	font-size: 20px;
}
.faq-icon {
    	width: 30px;
    	height: 30px;
}
.faq-question-label img, .faq-answer-label img {
    	width: 30px;
    	height: 30px;
}
.faq-question-label {
    	font-size: 90%;
    	text-align: left;
}
.faq-answer-label {
    	font-size: 85%;
}
.cta-chatch {
    	padding-bottom: 0;
}
.btn-outline {
	padding: 10px 40px;
    	font-size: 90%;
}
.recruit-cta {
    	padding-top: 30px;
}
.cta-buttons-new {
    	flex-direction: column;
    	gap: 20px;
}
.btn-primary-new {
    	width: 100%;
	padding: 10px 20px;
}
.btn-outline-new {
    	width: 100%;
	padding: 10px 20px;
}
.entry-main {
    	font-size: 24px;
}
.entry-sub {
    	font-size: 14px;
}
.arrow_bt {
    	font-size: 1em;
    	right: 20px;
    	top: 50%;
}
.footer-flex {
    	flex-direction: column;
    	gap: 40px;
	padding:0 20px;
}
.footer-col:nth-child(1),
.footer-col:nth-child(2),
.footer-col:nth-child(3) {
	width: 100%;
}
.footer-bottom-flex {
    	flex-direction: column;
    	gap: 10px;
    	text-align: center;
}
.cta-chatch {
    	font-size: 14px;
}
.highlight-banner {
    	font-size: 0.9em;
    	width: 100vw;
        margin-left: calc(50% - 50vw);
}
}

@media (max-width: 920px) {
.envelope-1 {
        top: 36%;
        left: 75%;
}
.envelope-2 {
        top: 66%;
        left: 20%;
}
.work-links .inner {
  	position: relative;
  	height: 1000px; /* 封筒が収まる高さに調整 */
}
}

@media (max-width: 675px) {

.hero-slide:first-child .hero-text {
        margin-left: 130px;
}
.hero-slide:first-child::after {
        width: 450px;
        height: 550px;
}
.hero-slide:first-child::after {
        left: -50px;
}
}

@media (max-width: 625px) {
.hero-slide:first-child::after {
       	width: 350px;
       	height: 450px;
}
.hero-slide:first-child .hero-text {
      	margin-left: 100px;
}
}

@media (max-width: 570px) {
.hero-slide:first-child .hero-text {
        margin-left: 0px;
}
.hero-slide:first-child p {
        font-size: 14px;
        margin-left: 150px;
        width: 230px;
}
.hero-slide:first-child h1{
	margin-top:20px;
}
.hero-slide:first-child::after {
      	left: -70px;
}
.hero-slide:first-child .cta-buttons-hero{
	margin-left:220px;
}
}

@media (max-width: 480px){
.hero-slide:first-child p {
     	margin-left: 100px;
}
.hero-slide:nth-child(3) h1 {
  	font-size: 26px;
}
.sp-br2{
	display:block;
}
.work-links .inner {
        height: 750px;
}
.envelope{
    	width: 300px;
    	height: 200px;
}
.envelope {
    	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.06),
                0 24px 48px rgba(0, 0, 0, 0.12);
}
.work-links::after {
    	height: 50px; /* 下端のグラデーションも短く */
}
.flying-photo {
    	width: 120px;
    	height: 120px;
}
.envelope-body::before {
        border-left: 145px solid transparent;
        border-right: 145px solid transparent;
	border-top: 130px solid #FFEFF2;
}
.envelope-body h2 {
        font-size: 27px;
}
.envelope-desc {
        font-size: 14px;
}
.works-btn {
    	padding: 5px 38px;
}
.envelope-1 {
        top: 40%;
        left: 82%;
}
.envelope-2 {
        top: 74%;
        left: 10%;
}
.photo1 {
        left: 10px;
}
.photo2 {
        left: 70px;
}
.photo3 {
        left: 130px;
	transform: rotate(15deg);
}
.photo4 {
        left: 10px;
}
.photo5 {
        left: 60px;
}
.photo6 {
        left: 140px;
}
.crosstalk-title-image img {
    	width: 100%;
    	opacity: 0.7;
}
.crosstalk-text {
    	left: 40%;
    	font-size: 28px;
}
.crosstalk-btn {
    	padding: 10px 40px;
    	right: 0;
}
.crosstalk-label01,.crosstalk-label,.crosstalk-label03{
        top: -20px;
}
.entry-title {
    	font-size: 28px;
}
.accell {
        width: 100%;
}
.message-paper-wrapper {
        padding: 40px 0;
}
.header-inner {
    	padding: 0 10px 0 0;
}
}