/* 085 */ #cmeMain.typeB #contents_wrap { font-family: 'Noto Sans JP', sans-serif; font-size: 133.334%; } #main_image { background-color: #ffffff ;} #head_wrap { font-size: 112.5%; } #head_wrap .text { padding: 58px 0 66px; } #head_wrap .text p{ margin-bottom: 0;line-height: 2; } #head_wrap .text p .text_notice {font-size: 77.78%;font-weight: bold;padding: 14px 25px;margin-bottom: 25px;line-height: 1.5;} #head_wrap .text p.note{font-size: 77.8%;font-weight: normal;padding-top: 14px;color: #333;} #column_wrap .bg_wrap { background-color: #f6f5ef; } #column_wrap .bg_wrap .border_title span img { background-color: #f6f5ef; } #column_wrap .border_title span img{ padding: 0; } #column_wrap .border_title+.text { margin-bottom: 32px; } #column_wrap .text { text-align: left; line-height: 1.75; } #column_wrap .column .text_left,#column_wrap .column .text_right,#column_wrap .column .img_left,#column_wrap .column .img_right{ width: 48.2964224872232%; } #column_wrap .row .text_left,#column_wrap .row .img_right{width: 48.2964224872232%;} #column_wrap .row .text_left p{ margin-bottom: 0; } #column_wrap .row .img_right img{margin-top: 8px;} #column_wrap .text_left p, #column_wrap .text_right p, #column_wrap .normal_text{ line-height: 1.859em; } #column_wrap .normal_text+.normal_text { margin-top: 25px; } #column_wrap .text + .column { margin-top: 32px; } #column_wrap .column + .column { margin-top: 40px; } #column_wrap .column + .normal_text { margin-top: 35px; } #column_wrap .normal_text + .column { margin-top: 34px; } #column_wrap .border_title{ margin-bottom: 20px; } #column_wrap #section_01 { padding: 85px 0 109px; } #column_wrap #section_02 { padding: 76px 0 110px; } #column_wrap #section_03 { padding: 74px 0 110px; } #column_wrap #section_04 { padding: 77px 0 0; } #column_wrap #section_01 .border_title:after { top: 67%; background-color:#c5c4bf;} #column_wrap #section_02 .border_title:after { top: 69%; background-color:#c5c4bf;} #column_wrap #section_03 .border_title:after { top: 70%; background-color:#c5c4bf;} #column_wrap #section_04 .border_title:after { top: 68%; background-color:#c5c4bf;} #column_wrap .subsection + .subsection{ padding-top: 53px; } #column_wrap .bg_wrap .text_right.list { background-color: #fff; } #column_wrap .text_right.list { width:38.076%; line-height:2;background:#f6f5ef; padding:42px 5.112% 55px; } #column_wrap .text_right.list h3 {font-weight: bold;border-bottom:1px solid #dcdcdc;padding-bottom: 4px;margin-bottom: 10px; } #column_wrap .text_right.list .detail_list+h4{ font-size: 87.5%;margin-top: 23px; } #column_wrap .text_right.list .detail_list .list { position: relative; display: flex; justify-content: space-between; z-index: 1; } #column_wrap .text_right.list .detail_list li+li { margin-top: 4px; } #column_wrap .text_right.list .detail_list .list.no_dash{margin-top: 3px;} #column_wrap #section_03 .text_right.list .detail_list .list.no_dash+.mrg_top{margin-top: 20px;} #column_wrap .bg_wrap .text_right.list .detail_list .list span{ background-color: #fff; } #column_wrap .text_right.list .detail_list .list span+span {display: ruby-base-container;} #column_wrap .text_right.list .detail_list .list span{ background-color: #f6f5ef; font-size: 87.5%; display: inline-block; } #column_wrap .text_right.list .detail_list .list:after{ content: "";position: absolute;left: 0;top: 50%;transform: translateY(-50%);background: url(../img/082/img_dot.png) repeat-x center center; background-size: 13px auto; width: 100%;height: 3px;z-index: -99; } #column_wrap .text_right.list .detail_list .list.no_dash { margin-left: 17px; } #column_wrap .text_right.list .detail_list .list_head{margin-left: -7px;} #column_wrap .text_right.list .note{font-size: 75%;margin-top: 28px;margin-bottom: 0;} #column_wrap .text_right.list .detail_list + .detail_list { margin-top:27px; } #column_wrap .label { font-size: 125%;font-weight: bold; margin-bottom: 25px; padding-bottom: 8px; border-bottom: 1px solid #c5c4bf; } #column_wrap .sub_label { font-weight: bold; line-height:1.625; margin-bottom: 9px; } #column_wrap .note_text+.sub_label{ margin-top: 40px; } #column_wrap .recipe_text{ line-height:2.125;letter-spacing: -0.01em;} #column_wrap .point_block .recipe_text{ position: relative;padding-left: 1em} #column_wrap .recipe_text span{position: absolute;left: 0;} #column_wrap .recipe_text+.sub_label { margin-top: 34px; } #column_wrap .text_left .recipe_text+.sub_label { margin-top: 34px; } #column_wrap .sub_label.one_point { font-size:112.5%; display: flex; align-items: center; margin-bottom: 8px;line-height: 1.33333; } #column_wrap .sub_label span.point_img { display: inline-block; padding-left: 0; } #column_wrap .sub_label span.point_text { color: #c00b09; padding-top: 9px; } #column_wrap .sub_label .point_text { padding-left: 0.3em; } #column_wrap #section_03 .point_block { margin-top: 53px; padding-bottom: 30px; } #column_wrap .point_block{ border: 1px solid #c5c4bf;padding: 25px 56px 30px 58px; margin-top: 52px; } #column_wrap #section_02 .point_block{margin-top: 54px; } #column_wrap .point_block .recipe_text+.recipe_text { margin-top: 0; } #column_wrap .note_text {font-size:87.5%;position: relative;padding-left: 15px;margin-top: 8px;} #column_wrap .note_text span {position: absolute;left: 0;} #column_wrap .note_text+.row{ margin-top: 40px; } #profile_wrap { padding: 111px 0 5px; } #profile_wrap .container { background-color: #f0efed;display: flex;align-items: top; } #profile_wrap .profile_img { float: left; width: 33.732%;border: 1px solid #f0efed; } #profile_wrap .profile_img img { width: 100%; vertical-align: bottom; } #profile_wrap .text .bold{ font-size: 100% } #profile_wrap .text_right{ width:56%; padding:5.8% 0 4.3% 5.12%; } #profile_wrap .text_right .inner{ padding-right: 8px; } #profile_wrap .text_right .inner a { color: #57a66b; } #profile_wrap .profile_text { margin-top:0.8em !important;margin-bottom:0!important; line-height: 1.75em !important; color: #333; } #profile_wrap .profile_text+.profile_text { margin-top: 0.3em !important; } #profile_wrap .profile_text img{vertical-align: middle;} #profile_wrap .profile_title{ font-size: 112.5%; line-height:1.44438 !important; margin-bottom: 0.2em!important;} #profile_wrap .profile_title small{ display: block;font-size: 88.89%;font-weight: bold;line-height: 1.75; } .release_date { font-size: 87.5%; margin-top: 30px; } #contents_wrap .return_corner_top { margin-top: 37px; } @media only screen and (max-width: 768px){ #column_wrap .text.list { padding: 45px 35px 42px; } #profile_wrap .profile_img { width: 40%} #profile_wrap .text_right { padding: 4.3% 0 4.3% 2%; } #profile_wrap .profile_text { font-size: 87.5%; } } @media only screen and (min-width: 768px) and (max-width: 1174px) { #main_image img { width: 124%; position: initial; left: 0; margin-left: -12%; margin-right: -12%; } } @media only screen and (max-width: 767px) { /*085*/ #cmeMain.typeB #contents_wrap { font-size: 100%; } #footer_button_area .container { margin-top: 35px; } #contents_wrap { margin-bottom: 45px; } #contents_wrap .text { line-height: 1.85714; } #head_wrap .text { padding: 50px 20px 40px; line-height: 1.5; } #head_wrap .text p { margin-bottom: 0; text-align: center;line-height: 1.5; } #head_wrap .text p .text_notice{font-size: 81.286%;padding: 3px 4px;margin-bottom: 15px;} #column_wrap .text_right { width: auto; } #column_wrap .caption{ margin-top: 10px;font-size: 85.7%;text-align: center; } #column_wrap .column .text_left,#column_wrap .column .text_right,#column_wrap .column .img_left,#column_wrap .column .img_right{ width: 100%; } #column_wrap .column .img_right+.text_left, #column_wrap .column .text_left+.img_right, #column_wrap .column .img_left+.text_right, #column_wrap .column .img_left+.img_right { margin-top: 25px; } #column_wrap .column + .column { margin-top: 25px; } #column_wrap .text_left p, #column_wrap .text_right p { margin-bottom: 0; } #column_wrap #section_01 { padding: 30px 0 45px; } #column_wrap #section_02 { padding: 30px 0 45px; } #column_wrap #section_03 { padding: 30px 0 45px; } #column_wrap #section_04 { padding: 30px 0 45px; } #column_wrap .subsection + .subsection{ padding-top: 30px; } #column_wrap #section_01 .border_title,#column_wrap #section_02 .border_title,#column_wrap #section_03 .border_title { margin-bottom: 25px; } #column_wrap .border_title span img{ padding: 0 10px; } #column_wrap #section_01 .border_title:after { top: 85%; } #column_wrap #section_02 .border_title:after { top: 80%; } #column_wrap #section_03 .border_title:after { top: 82%; } #column_wrap .row .text_left,#column_wrap .row .img_right{width: 100%;} #column_wrap .column,#column_wrap #section_02 .column{padding-top: 30px;} #column_wrap .text + .column {margin-top: 0;} #column_wrap .text.list{ width: auto; padding: 20px 15px; } #column_wrap .text_right.list .detail_list + .detail_list {margin-top: 23px;} #column_wrap .text.list h3{ font-size: 115%; } #column_wrap .sub_label { font-size: 114.5%; } #column_wrap .sub_label.one_point{ font-size: 129%; } #column_wrap .recipe_text+.sub_label{ margin-top: 1.3em; } #column_wrap .text.list .detail_list .list span { font-size: 100%; } #column_wrap .text.list .detail_col { display:block; } #column_wrap .text.list .detail_col .col+.col{margin-left: 0} #column_wrap .text.list .detail_col .col+.col > h4{margin-top: 23px;} #column_wrap #section_03 .text.list .detail_col .col+.col .detail_list:nth-of-type(1){margin-top: 23px;} #column_wrap .text.list .detail_col .col{width: 100%} #column_wrap .text.list .detail_list .list.no_dash{margin-left: 12px;} #column_wrap .text_right.list .detail_list+h4 {font-size: 100%;} #column_wrap .detail_list.border_line{margin-left: 15px;} #column_wrap #section_01 .row+.sub_label{ margin-top: 34px; } #column_wrap .note_text+.row,#column_wrap .note_text+.sub_label{ margin-top: 34px; } #column_wrap .point_block,#column_wrap #section_03 .point_block{ padding: 20px; } #column_wrap #section_02 .point_block{margin-top: 52px;} #column_wrap #section_03 .point_block{ margin-top: 50px; } #profile_wrap { padding-top: 38px; padding-bottom: 0; } #profile_wrap .container { display: block; padding: 32px 23px; } #profile_wrap .profile_img { float: none; text-align: center; width: auto; margin-bottom: 25px; padding: 0;} #profile_wrap .text .bold { font-size: 107.5%; } #profile_wrap .text_right { float: none; width: 100%; max-width: inherit; padding:0; text-align: left; } #profile_wrap .text_right .inner { padding: 0; } #profile_wrap .profile_text { font-size: 93%; } #profile_wrap .profile_img img { width: 100%; } .release_date { margin-top:20px;font-size: 85.7%; } #contents_wrap .return_corner_top{ margin: 30px auto 0; } } /* ------------------------------------------- 読み切りコラム一覧へ ---------------------------------------------- */ #contents_wrap .return_corner_top { margin: 50px auto; padding-top: 1em; border-top: 1px solid #e8e8e8; text-align: center; color: #64439c; } #contents_wrap .return_corner_top a { display: inline-block; padding-left: 17px; background: url(../img/arr_back.png) no-repeat 0 47%; } #contents_wrap .return_ctop_btn { width: 465px;margin: 35px auto 0;text-align: center; } #contents_wrap .return_ctop_btn a { display: flex;justify-content: center;align-items: center;width: 100%;height: 48px;padding: 0 24px;background-color: #fff;border: 1px solid #dbdbdb;border-radius: 3px;line-height: 1.7;text-decoration: none;transition: all 0.3s ease;color: #222;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; } #contents_wrap .return_ctop_btn a:after { content: '';display: block;width: 7px;height: 7px;margin: 0 0 0 5px;border-top: 2px solid #c00;border-right: 2px solid #c00;transform: rotate(45deg); } #contents_wrap .return_ctop_btn a:hover { color: #c00 !important;background: #f5f5f5; } @media only screen and (max-width: 767px) { #contents_wrap .return_corner_top { margin: 30px auto 0; } #contents_wrap .return_corner_top a { padding-left: 17px; background: url(../img/arr_back_x2.png) no-repeat 0 47%; background-size: 14px auto; } #contents_wrap .return_ctop_btn { width: auto;margin-top: 40px; } #contents_wrap .return_ctop_btn a { position: relative;height: calc(100vw/(750/96));padding: 0 24px 2px;border-radius: 5px;font-size: calc(100vw/(750/26)); } #contents_wrap .return_ctop_btn a:after { position: absolute;top: 50%;right: calc(100vw/(750/18));width: 9px;height: 9px;margin: -5px 0 0; } } /* ------------------------------------------- SNS share ---------------------------------------------- */ #bottom_share { display: flex;justify-content: center;margin: 48px 0 80px;list-style-type: none; } #bottom_share li#twitter .box .share, #bottom_share li#facebook .box .share { width: 44px;height: 44px;margin: 0 13px;/*background: #ccc;*/background-repeat: no-repeat;background-position: 50% 50%;text-indent: -9999px;outline: none } #bottom_share li#twitter .box .share { background-color: #1da1f2;background-image: url(/club-me/common/v0006/images/icon_twitter.svg);background-size: 25px auto;border-radius: 50%; } #bottom_share li#facebook .box .share { background-image: url(/club-me/common/v0006/images/icon_facebook.svg);background-size: contain; } @media only screen and (max-width: 767px) { #bottom_share { margin: 60px 0 50px; } #bottom_share li#twitter .box .share, #bottom_share li#facebook .box .share { margin:0 calc(100vw/(750/40)) } }